javascript中原型链与原型链继承详解

前言        

        虽然很久以前就开始学习javascript了，但是关于原型链的知识开始接触使用，还是通过一年前的一个项目有了一定的了解，但是今天有个同事突然问我这个问题，讲了好久可能是自己理解的不够透彻，说来说去总觉得只可意会不可言传，于是乎就又查了查资料，为了看看自己真的懂了没现在，想总结下关于原型链继承等系列知识，欢迎各位路过的神仙们对我的内容批评指正。

储备知识点

        学习知识第一步一般都需要简单了解下所学东西大致是个啥，现在有可能云里雾里的，但是带着问题学习也有好处，那么我们就通过下面这张图简单介绍下本文的主角prototype和__proto__：

    

--图片源自网络

通过new关键字理解prototype和__proto__

        在搞明白什么是原型链继承之前有一个关键字是有必要了解一下的，那就是new这个容易被忽略的关键字，如果你能回答上来new对象的过程中究竟做了些什么？这个问题的话那这一小节可以跳过，那么现在就来讲讲这个东西。

        下面将以var fun=new Function();为例简单的了解下new的过程中究竟干了个嘛？

new Function()={
var fun={};
fun.__proto__=Function.prototype;
var result=Function.call(fun);
return typeof result==='Function'?result:fun;
}

        不难看出其实在new对象时不是简单的返回一个对象，中间经历了核心的三步：

        1.首先就是创建一个同名的空的fun对象；

        2.紧接着就是把Function上的prototype属性赋给fun对象的__proto__属性(这里不知道这个是什么没有关系就知道进行了这么一步，后面讲解prototype，__proto__时会详细介绍)；

        3.使用fun替换Function的上下文context

通过三句话理解prototype和__proto__

1.proptotype和__proto__都是属性，但是只有函数对象才有prototype拥有prototype属性

2.任何对象的__proto__都指向它的构造函数的prototype

3.prototype属性指向原型对象因此也有自己的__proto__属性指向的是prototype的对象的构造函数的prototype属性

通过一张经典图理解prototype和__proto__

--图片源自网络