您的位置:首页 > Web前端 > JavaScript

从__proto__理解prototype

2014-10-19 16:32 288 查看
“every object has a prototype” 原以为很简单的一句,曾经缺没有真正理解,这里再整理一下。

function Cat(){

    this.name="cat";

}

Cat.prototype.say=function(){

    console.log("i am a "+this.name);

}

var c=new Cat();

c.say() // "i am a cat"

“every object has a prototype” 有个误解就是每个对象都有prototype属性,但是console.log打印出来的是undefined,正确的理解应该为:每个对象都有原型(prototype),而不是原型属性。

prototype是ES语言中的特性,以prototype chain自底向上查找,而恰巧每个函数有个prototype属性,并且通过构造函数new出来每个对象的原型(prototype)指向的就是其构造函数的名称为"prototype"的属性指定的对象,这里需要注意,引擎查找对象的原型(prototype)不是通过对象的prototype属性进行查找的,在firefox和chrome中,是通过对象的__proto__进行查找(proto前后连接两个下划线),ES5标准中__proto__不是一个标准属性,但是firefox和chrome将这个属性露了出来,在ES6草案中__proto__已经作为一个标准属性即__proto__来指向对象的原型。

假如对象是上面new出来的c,可以理解为:

1.c.__proto__===Cat.prototype // __proto__是用来查找原型对象的属性

2.Cat.prototype //构造函数的一个属性,所有new出来的对象其原型都会指向构造函数的这个属性

3.c.prototype //不存在,如果理解为“c.prototype指向对象的原型”,错了,是__proto__指向对象的原型。

4.Cat.__proto__===Function.prototype //所有的函数原型都指向了Function的prototype属性

为什么Cat有prototype属性?

先理解new+构造函数创建对象时(var c=new Cat())做了什么:

1.创建一个空对象 //var c={}

2.将this设置为刚创建的对象 //Cat.call(c)

3.将新对象的原型指向构造函数的原型属性(Cat.prototype) //cat.__proto__===Cat.prototype

最后一点说明构造函数的prototype是定义函数后是就有的,默认为一个空对象:{},并且这就是个普通的对象,可以增加属性和方法,唯一特殊的就是new 出来的新对象的原型会指向构造函数的prototype属性,这个属性名称是约定好的。

总结:

1.所有对象都有__proto__属性,这个属性指向对象的原型对象

2.只有函数有prototype属性,并且约定所有new出来的对象其__proto__指向其构造函数的prototype属性指定的对象

3.看文档是要注意prototype和property prototype的区别,一个是指原型,一个是指名称为"prototype"的属性。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  javascript