关于js原型链 原型的个人理解

来源:互联网 发布:mac 怎么使用语音朗读 编辑:程序博客网 时间:2024/06/05 19:31

这几天看了关于原型的很多博客,大体上对原型有了更好的认识。
结合几张图来说说自己的理解吧。

首先要知道,js中每一个函数都对应的有一个叫prototype的属性,而这个属性对应的值他又是一个对象,其实函数也是对象就是了。记得还看过一个视频说过,每一个构造函数,也就是

function Computer(){        this.brand="";        this.price=0;        this.typeName="";        this.work=function(){            console.log("我是电脑,我在工作!");        }        this.show=function(){            console.log("我的品牌是:"+this.brand+",我的价格是:"+this.price+",我的类型是:"+this.typeName);        }    }    //调用构造函数    var c1=new Computer();    c1.brand="联想";    c1.price=5000;    c1.typeName="笔记本";    c1.show();

每一个构造函数对应的都有一个原型对象,也就是那篇博客中说的prototype属性中的值就是一个对象,而这个对象有一个属性叫做constructor属性,这个属性则指向他本身也就是这个函数。
用下图表示很清晰
这里写图片描述
故Computer.prototype.constructor===Computer。

而当你给这个原型对象添加属性时,你new出来的对象就可以调用prototype中的属性。
而每一个new 出来的对象他又有一个_ proto_属性,
因为每个对象都有一个隐藏的属性——“_ proto_”,这个属性引用了创建这个对象的函数的prototype。即:fn._ proto_ === Fn.prototype。

再看这张图:
这里写图片描述
从function Foo()分析,它的prototype和constructor都没有问题,他new出来的f1的_ proto_属性也是指向Foo的prototype,也就是f1._ proto_ === Foo.prototype。而他的Foo.prototype的_ proto_属性又为啥指向Object.prototype呢?或者说为啥他会有_ proto_属性?因为Foo他是函数他更是对象啊。他不就是Object new出来的对象么?所以啊他会指向Object的prototype,也就是Foo.prototype._ proto_ ===Object.prototype

再看第二行 function Object(),首先它的prototype和constructor都没有问题。 var o1={}; 和var new Object()是一个东西,所以他的_ proto_也就指向Object.prototype,而Object.prototype._ proto_指向的却是null。再想想function Object()的_ proto_又为啥指向Function. prototype?因为Object是由Function实例出来的。

再看最后一行function Function,第一次看到这个我也优点蒙,还有这东西啊,后来了解才知道Function是个类和Array String很相似,也就是说所有funciton都是Function实例话出来,故有了Foo的_ proto_指向Function.prototype。而Function.prototype._ proto_指向Object.prototype说实话这里我也不太明白,记住就好…最后function Function()的_ proto_是指向他的原型对象Function.prototype,也就是说他是自己new 出来自己的。
最后,这些都是自己学习过程中看到的博客加上自己的理解,可能有自己的理解错误,欢迎指正~

0 0
原创粉丝点击