JS原型链

原型链式JS与Java,c#等编译语言的一点特别特别特别大的不同，

JS没有类的概念(ES6添加了class语法,不过小弟暂时还不了解), 靠的就是原型链来实现继承,即使是最简单的new一个对象也是原型链的概念！！！

所以原型链很重要。

最近在看MDN的js reference,里面包含了目测全部的API,方法,属性.于是在Object.create(),Object.getPrototypeOf(obj), instanceof等几个全局方法卡住了,在一番依旧以后发现,以前总是看书,得到的都是不完全的,那些“hong 宝书”介绍的都不全面.

不扯废话，上干的！

在JS的世界里一切都是对象object,包括函数也是对象(function对象),毕竟对象就是构造函数new出来的,两者不可能分开.

如果看过几本书,或者几篇文章会知道object,function都有原型的概念,重要的是都不说明白,function的原型和object的原型压根不是一个东西,而且只是！只是！名字都称为原型而已,在语法上面不一样！不一样！不都是prototype

我们理解的,我们需要的原型是可以继承属性,方法的原型链

正确方法！

函数function的原型是通过functionName.prototype来直接访问.

对象object的原型是内部属性,本不应该访问,在chrome浏览器下可以通过objectName.__proto__来访问.

并且每次使用var obj = new functionName()来创建对象时,obj.__proto__==function.prototype

这是最基本的概念,也是我们理解的原型,下面再介绍两点不一样的

前面说过了,function也是object对象啊,那应该也有functionName.__proto__,对！但这就相当于获取了函数对象的原型,这是函数的底层了,其实我们大部分时候基本用不到这个东西.

另一点,也是我之前理解错误的一个点就是object.prototype(理解错误实在是因为一知半解只知道有原型,却不知正确使用), 如果你这样设置,这真的只是设置了一个对象属性key为prototype,value为另一个对象object.属性不会继承,仅仅是表面的包含关系.由于缺少实战经验就不评价这种做法的可行性.

说到底还是要用代码来证明,下面代码全部实现于Chrome的F12下.

图一我们证明function.prototype是正确的继承方法

图二我们证明object.__proto__才是正确的原型链,可以继承.而object.prototype只是普通属性而已.

图三我们证明 new创建对象时,自动将构造函数的prototype付给obj.__proto__属性

图四我们证明,当把普通函数作为对象查看__proto__(对象概念的原型)时,他的原型就是Function(函数对象)的原型

最后,原型的原型可以继续拥有原型这个属性,最后这个属性会一直追寻到Object的__proto__=null结束.

最后希望看到这篇文章并且与我曾经有相同困惑的人可以去看MDN,虽然不一定全部看完,但是看的途中你就会发现很多之前你模糊的东西. 祝好运