看完这篇文章后，我对JavaScript原型链感到困惑，然后我找到了这些图表

http://iwiki.readthedocs.org/en/latest/javascript/js_core.html#inheritance

这是一个清晰的图表，通过原型链显示JavaScript继承

and

http://www.javascriptbank.com/javascript/article/JavaScript_Classical_Inheritance/

这一个包含一个带有代码的示例和几个漂亮的图表。

原型链最终返回到Object.prototype。原型链可以根据您的需要进行技术上的扩展，每次都将子类的原型设置为父类的对象。

希望这对您理解JavaScript原型链也有帮助。

Javascript没有通常意义上的继承，但它有原型链。

原型链

如果在对象中找不到对象的成员，它会在原型链中查找它。链由其他对象组成。可以使用__proto__变量访问给定实例的原型。每个对象都有一个，因为javascript中的类和实例之间没有区别。

向原型中添加函数/变量的优点在于，它只需在内存中存在一次，而不是针对每个实例。

它对于继承也很有用，因为原型链可以由许多其他对象组成。

在Java、C#或C++等实现经典继承的语言中，首先要创建一个类——一个对象的蓝图——然后可以从该类创建新对象，或者可以扩展该类，定义一个新类来扩充原始类。

在JavaScript中，您首先创建一个对象（没有类的概念），然后您可以扩充自己的对象或从中创建新对象。这并不难，但对于习惯了传统方式的人来说，有点陌生，很难消化。

例子：

//在JavaScript中定义一个函数对象以容纳人员var Person=函数（名称）{this.name=名称；};//向已定义的对象动态添加一个新的getterPerson.prototype.getName=函数（）{返回this.name；};//创建Person类型的新对象var john=新人（“john”）；//试试吸气剂警报（john.getName（））；//如果现在我修改人，John也会得到更新Person.prototype.sayMyName=函数（）{alert（'你好，我的名字是'+this.getName（））；};//对john调用新方法john.sayMyName（）；

到目前为止，我一直在扩展基本对象，现在我创建了另一个对象，然后从Person继承。

//Create a new object of type Customer by defining its constructor. It's not 
//related to Person for now.
var Customer = function(name) {
    this.name = name;
};

//Now I link the objects and to do so, we link the prototype of Customer to 
//a new instance of Person. The prototype is the base that will be used to 
//construct all new instances and also, will modify dynamically all already 
//constructed objects because in JavaScript objects retain a pointer to the 
//prototype
Customer.prototype = new Person();     

//Now I can call the methods of Person on the Customer, let's try, first 
//I need to create a Customer.
var myCustomer = new Customer('Dream Inc.');
myCustomer.sayMyName();

//If I add new methods to Person, they will be added to Customer, but if I
//add new methods to Customer they won't be added to Person. Example:
Customer.prototype.setAmountDue = function(amountDue) {
    this.amountDue = amountDue;
};
Customer.prototype.getAmountDue = function() {
    return this.amountDue;
};

//Let's try:       
myCustomer.setAmountDue(2000);
alert(myCustomer.getAmountDue());

var Person=函数（名称）{this.name=名称；};Person.prototype.getName=函数（）{返回this.name；};var john=新人（“john”）；警报（john.getName（））；Person.prototype.sayMyName=函数（）{alert（'你好，我的名字是'+this.getName（））；};john.sayMyName（）；var客户=函数（名称）{this.name=名称；};Customer.prototype=新角色（）；var myCustomer=新客户（“梦想股份有限公司”）；myCustomer.sayMyName（）；Customer.prototype.setAmountDue=函数（amountDue）{this.amountDue=amountDue；};Customer.prototype.getAmountDue=函数（）{return this.amountDue；};myCustomer.setAmountDue（2000）；警报（myCustomer.getAmountDue（））；

虽然如上所述，我不能调用setAmountDue（），但对Person调用getAmountDu（）。

//The following statement generates an error.
john.setAmountDue(1000);

原型通过克隆现有对象来创建新对象。所以，当我们考虑原型时，我们真的可以考虑克隆或复制一些东西，而不是虚构。

考虑以下keyValueStore对象：

var keyValueStore = (function() {
    var count = 0;
    var kvs = function() {
        count++;
        this.data = {};
        this.get = function(key) { return this.data[key]; };
        this.set = function(key, value) { this.data[key] = value; };
        this.delete = function(key) { delete this.data[key]; };
        this.getLength = function() {
            var l = 0;
            for (p in this.data) l++;
            return l;
        }
    };

    return  { // Singleton public properties
        'create' : function() { return new kvs(); },
        'count' : function() { return count; }
    };
})();

我可以通过执行以下操作创建此对象的新实例：

kvs = keyValueStore.create();

此对象的每个实例都将具有以下公共财产：

数据收到设置删去获取长度

现在，假设我们创建了这个keyValueStore对象的100个实例。尽管get、set、delete、getLength将对这100个实例中的每一个执行完全相同的操作，但每个实例都有自己的函数副本。

现在，想象一下，如果您只有一个get、set、delete和getLength副本，并且每个实例都引用相同的函数。这将更好地提高性能，并且需要更少的内存。

原型就是这样产生的。原型是财产的“蓝图”，它是继承而不是被实例复制的。因此，这意味着对于一个对象的所有实例，它只在内存中存在一次，并且由所有这些实例共享。

现在，再次考虑keyValueStore对象。我可以这样重写：

var keyValueStore = (function() {
    var count = 0;
    var kvs = function() {
        count++;
        this.data = {};
    };

    kvs.prototype = {
        'get' : function(key) { return this.data[key]; },
        'set' : function(key, value) { this.data[key] = value; },
        'delete' : function(key) { delete this.data[key]; },
        'getLength' : function() {
            var l = 0;
            for (p in this.data) l++;
            return l;
        }
    };

    return  {
        'create' : function() { return new kvs(); },
        'count' : function() { return count; }
    };
})();

这与keyValueStore对象的上一版本完全相同，只是它的所有方法现在都放在一个原型中。这意味着，所有100个实例现在都共享这四个方法，而不是每个实例都有自己的副本。

将原型链分为两类可能会有所帮助。

考虑构造函数：

 function Person() {}

Object.getPrototypeOf（Person）的值是一个函数。事实上，它是Function.prototype。由于Person是作为一个函数创建的，所以它与所有函数共享相同的原型函数对象。与Person相同__proto__，但不应使用该属性。无论如何，使用Object.getPrototypeOf（Person），您可以有效地沿着所谓的原型链的阶梯前进。

向上的链条如下所示：

人员→ 功能.原型→ Object.prototype（终点）

重要的是，这个原型链与Person可以构造的对象关系不大。这些构造的对象有自己的原型链，而这个链可能和上面提到的对象没有共同的祖先。

以该对象为例：

var p = new Person();

p与Person没有直接的原型链关系。他们的关系是不同的。对象p有自己的原型链。使用Object.getPrototypeOf，您会发现链如下：

p型→ 人物原型→ Object.prototype（终点）

此链中没有函数对象（尽管可能是）。

所以Person似乎与两种链条有关，它们各自生活。要从一条链“跳”到另一条链，请使用：

.prototype：从构造函数的链跳到创建的对象的链。因此，此属性仅为函数对象定义（因为new只能用于函数）。构造函数：从创建的对象链跳到构造函数链。

以下是所涉及的两个原型链的可视化演示，以列表示：

总结如下：

prototype属性不提供主题原型链的信息，而是提供主题创建的对象的信息。

属性原型的名称会导致混淆，这并不奇怪。如果将此属性命名为prototypeOfConstructedInstance或类似的名称，可能会更清楚。

您可以在两个原型链之间来回跳转：

Person.prototype.constructor === Person

通过将不同的对象显式指定给原型属性，可以打破这种对称性（稍后将详细介绍）。

创建一个函数，获取两个对象

Person.prototype是在创建函数Person的同时创建的对象。它具有Person作为构造函数，即使该构造函数尚未实际执行。因此，同时创建了两个对象：

功能Person本身将函数作为构造函数调用时充当原型的对象

两者都是对象，但它们具有不同的角色：函数对象构造，而另一个对象表示函数将构造的任何对象的原型。原型对象将成为其原型链中构建对象的父对象。

由于函数也是一个对象，所以它在自己的原型链中也有自己的父级，但请记住这两个链是关于不同的事情的。

以下是有助于把握问题的一些等式——所有这些都是正确的：

函数Person（）｛｝；//这是构造函数（函数对象）的原型链信息：console.log（Object.getPrototypeOf（Person）==Function.prototype）；//在同一层次结构中更进一步：console.log（Object.getPrototypeOf（Function.prototype）==Object.proto原型）；console.log（Object.getPrototypeOf（Object.prototype）==null）；console.log（Person.__proto__==Function.prototype）；//这里我们交换通道，并查看构造函数的构造函数console.log（Person.constructor==函数）；console.log（函数的个人实例）；//Person.prototype由Person创建（创建时）//这里我们来回交换车道：console.log（Person.prototype.constructor==人员）；//虽然它不是它的一个实例：console.log（！（Person.prototype instanceof Person））；//实例是由构造函数创建的对象：var p=新角色（）；//类似于为构造函数显示的内容，这里我们有//构造函数创建的对象也是如此：console.log（Object.getPrototypeOf（p）==Person.prototype）；console.log（p.__proto__==Person.prototype）；//在这里，我们交换通道，并查看构造函数console.log（p.constructor==人员）；console.log（p instanceof Person）；

向原型链添加级别

虽然在创建构造函数函数时创建了原型对象，但可以忽略该对象，并为该构造函数创建的任何后续实例分配另一个应用作原型的对象。

例如：

function Thief() { }
var p = new Person();
Thief.prototype = p; // this determines the prototype for any new Thief objects:
var t = new Thief();

现在t的原型链比p长一步：

吨→ p→ 人物原型→ Object.prototype（终点）

另一个原型链不再长：Thief和Person是兄弟姐妹，在原型链中共享同一个父级：

个人}小偷}→ 功能.原型→ Object.prototype（终点）

之前展示的图形可以扩展到这一点（省略了最初的Thief.原型）：

蓝色线条表示原型链，其他彩色线条表示其他关系：

在对象及其构造函数之间在构造函数和将用于构造对象的原型对象之间