原型;我们先来看段简单的函数
按照javascript的说法,function定义的这个Person就是一个Object(对象),而且还是一个很特殊的对象,这个使用function定义的对象与使用new操作符生成的对象之间有一个重要的区别。这个区别就是function定义的对象有一个prototype属性,使用new生成的对象就没有这个prototype属性,我们一般称为普通对象!
我们需要理解记忆以下的逻辑顺序:
Person是一个对象,它有一个prototype的原型属性(因为所有的对象都一prototype原型!)prototype属性有自己的prototype对象,而pototype对象肯定也有自己的constuct属性,construct属性有自己的constuctor对象,神奇的事情要发生了,这最后一个constructor对象就是我们构造出来的function函数本身!
这张图片只是证明了每一个对象函数都有一个原型对象而已
再来看看网上流传最广的一张描述帮助解释原型的一张图片
new去新的构造一个实例的时候new出来的新实例之间属性和方法是不能共享的,它的优点和缺点都是这一点。而当有多个实例的时候,我们把公共的属性方法用prototype原型去创建,把私有的属性方法new去创建。
原型在设计之初就是用来解决js中继承的问题的。js中没有c++和java的类,js设计之初就是借鉴了java和c++中的new方法,去构建新的实例,用prototype原型链去弥补new方法中的不足。具体的一些信息建议参考阮一峰的。他的理解很有借鉴性。
会不会很抽象?我认为挺抽象的。不过别急,我在搜索原型及原型链的时候看到一道对于我们理解原型很有帮助的一道题目,理解了这道题目,原型什么的题目都不是事啦。但是做题和理解又不一样,这里我推荐阮一峰的关于原型的理解;http://www.ruanyifeng.com/blog/2011/06/designing_ideas_of_inheritance_mechanism_in_javascript.html
现在我们来看题。
待我和小伙伴们讲完这题,相信大部分小伙伴就可以理解了
首先我们看Foo.getName();这个我们只需要在上述中寻找相应的函数即可。很明显,我们找到是2;
getName();这个我们也可以直接找,找到的是4;
Foo().getName();的意思是Foo()中的getName()方法。。。小伙伴们这样就可以很快的找到答案了唉,答案就是1;
getName();这个为什么和上面的getNmae()不一样了呢?var getName是定义了一个变量,当没有调用Foo函数的时候,线程直接进行到4,而当Foo()调用的时候,getName变量在Foo()函数中输出的是1,整个线程的getName都变成了1,4被覆盖了。
new Foo.getName();其实有没有new没有影响,都是2,
最后两个,new Foo().getName();和new new Foo().getName();是构造了两个新的getName的对象,类似于prototype创建。多少个new是没有关系的,所以都是3.
抱歉,关于原型我试图去讲明白,但是网上讲的很抽象,我理解的也抽象,实在阐述不清楚。如果有能阐述清楚的希望您能指点一二。