美文网首页
js高级之原型、原型链

js高级之原型、原型链

作者: 小黄鱼的偏执 | 来源:发表于2017-12-19 19:38 被阅读0次

    在讲原型之前先补点知识。。。。

    构造函数的注意事项

    1. 默认函数首字母大写。
    2. 构造函数并没有显示返回任何东西,当调用构造函数时,new会自动创建this对象,且类型就是构造函数类型。
    3. 因为构造函数也是函数,所以可以直接调用,但是它的返回值是undefine,此时构造函数里面的this对象等于全局this对象。

    原型

    1. 构造函数中有一个属性:prototype,叫原型,是给我们程序员用的。
    2. 实例对象中有一个属性:__proto__,也叫原型,这个是给浏览器看的。
    3. 构造函数中的原型和实例对象中的原型都是属性,也都是对象。
    4. 构造函数中的prototype和实例中的__proto__指向相同。
    5. prototype的数据可以被实例对象访问和使用。
    6. 如果希望数据能够共享,应该把数据放在原型中写属性和方法,如果不需要共享,那就放在构造函数中定义。
    7. 实例对象调用的方法,如果在构造函数的prototype中存在就可以直接被调用

    例子:

    //构造函数
            function Person(name, age) {
                this.name = name;
                this.age = age;
                this.eat = function () {
                    console.log("今天晚上我要吃鸡腿");
                };
            }
            //实例对象
            var p = new Person("小黑", 12);
            console.dir(p.__proto__);
            console.dir(Person.prototype);
            console.dir(p);
            console.dir(Person);
            /*
             *
             * 构造函数中都有一个属性:prototype,叫原型,是程序员用的
             * 实例对象中都有一个属性:`__proto__`,叫原型,是浏览器用的,不标准
             * 无论是`prototype`还是`__proto__`都可以看成是一个对象
             *
             * 构造函数中的原型(prototype)和实例对象中的原型`__proto__`都是属性,也都是对象
             * 构造函数中的prototype和实例对象中的`__proto__`指向相同
             * */
    
    
            //构造函数中只有属性
            function Person(name, age) {
                this.name = name;
                this.age = age;
            }
            //在Person的原型中添加eat方法
            Person.prototype.eat = function () {
                console.log("有了");
            };
    
            var p1 = new Person("小黑", 20);
            var p2 = new Person("小白", 21);
            //实例对象是可以使用的
            p1.eat();
            p2.eat();
            console.dir(p1);
            console.dir(p2);
            console.dir(Person);
            console.log(p1.eat === p2.eat);//true
    

    原型链

    1. 构造函数和实例对象是通过原型联系的。
    2. 原型链的指向是可以改变的
    3. 如果实例对象中的属性和原型对象中的属性重名,使用实例对象中的属性,但是原型对象中的属性不会改变。
    4. 对象中的__proto__指向的是自己的构造函数的prototype.
    5. 如果构造函数的prototype指向发生改变,那么实例对象中的__proto__指向也会发生改变。
    6. 如果实例对象的原型指向改变了,在向原型中添加方法,那么这个方法添加到了所改变指向的位置。

    相关文章

      网友评论

          本文标题:js高级之原型、原型链

          本文链接:https://www.haomeiwen.com/subject/oopiwxtx.html