细说javascript的对象
代码
1 function Foo(name) { 2 this.name = name; 3 } 4 5 var f1 = new Foo("kinthon");
说明:在这里我们只讨论关于对象的,不讨论代码执行上下文的阶段;下文说到的构造子就是Java语言中的构造函数;在JS中都是引用,都是对象(除了数字字面量和"undefined")
1)当我们的Person构造子(也就是Person函数)被解析完后,内存中的状态为
可以看出,虽然我们只是添加了一个this.name=name;但是解析器背后为我们处理了大量的操作,常见的arguments对象,还有caller,length以及函数的name; 这里主要说明下prototype和__proto__; 对于prototype这个属性,它是一个对象,类似于一个指针,指针了我们的函数原型;在没有处理的情况下,原型的情况如下
也就是说我们原型一开始有的属性就是一个constructor,这个属性指向了我们Person函数;在这里我们先不讲构造子的__proto__属性,所以情况如下
2)当我们执行了
var f1 = new Foo("kinthon");
之后,发生了什么呢?看内存
可以看出,f1属性中有我们设置的age属性,同时注意到这里也有一个__proto__; 通过以上的解释我们知道,如果是Person object的话,这个函数是可以通过其prototype来访问Person的原型的,但是对于用Person这个构造子构造出来的对象怎么访问Person的原型呢?也就是说实例对象怎么访问其构造子的原型,这个就是通过__proto__属性来实现的。这个属性也类似于一个指针,指向了构造子的原型。所以情况如下:
现在我们解释下为什么在Foo下既有prototype,又有__proto__,要理解这两个的作用是不一样的,prototype是指向自身的原型,而__proto__是指向构造子的原型,那么谁会是Foo的构造子?我们知道Foo本身是一个Function,所以其构造子就是Function了,所以Foo中的__proto__也就是指向了Function 的原型了
3)到这里我们总结下,在JS中构造子,也可以说是function,都会有一个prototype对象指向其自身的原型 ,而原型同样会有一个constructor对象指向其函数;而通过构造子实例化后的对象都会有一个__proto__对象指向了其构造子的原型;
4)综上我们再看一个现象
在prototype中有一个__proto__属性,这个属性指向了Object;不难理解,因为prototype也是一个对象,所以其也会有构造子和其构造子的原型,它的构造子就是Object函数对象了[在js中没有显示指定的构造子函数的对象都是以Object为构造子创建的];所以到这里我们也就不难理解,为什么我们可以在f1中调用toString()这些Object的方法了。
最后给一个总的链图: