JavaScript中的原型和继承详解(图文)(2)

　　JavaScript 中的原型对象的确是特殊的，因为他们遵从以下规则。当我们告诉 JavaScript 我们要调用一个对象的 push 方法，或读取对象的 x 属性时，运行时会首先查找对象本身。如果运行时找不到想要的东西，它就会循着 __proto__ 引用和对象原型寻找该成员。当我们  调用 myArray 的 push 方法时，JavaScript 并没有在 myArray 对象上发现 push 方法，而是在 myArray 的原型对象上找到了，于是 JavaScript 调用此方法（见图 3）。

图 3

　　上面所描述的行为是指一个对象本身继承了原型上的任何方法或属性。JavaScript 中其实不需要使用类语法也能实现继承。就像从赛车原型上继承了相应的技术的车，一个 JavaScript 对象也可以从原型对象上继承功能特性。

　　图 3 还展示了每个数组对象同时也可以维护自身的状态和成员。在请求得到 myArray 的 length 属性的情况下，JavaScript 会取得 myArray 中 length 属性的值，而不会去读取原型中的对应值。我们可以通过向对象上添加 push 这样的方法来“重写”push 方法。这样就会有效地隐藏原型中的 push 方法实现。

　共享原型

　　JavaScript 中原型的真正神奇之处是多个对象如何维持对同一个原型对象的引用。例如，如果我们创建了这样的两个数组：

var myArray = [1, 2]; var yourArray = [4, 5, 6];

　　那么这两个数组将共享同一个原型对象，而下面的代码计算结果为 true：

Object.getPrototypeOf(myArray) === Object.getPrototypeOf(yourArray);

　　如果我们引用两个数组对象上的 push 方法，JavaScript 会去寻找原型上共享的 push 方法。

图 4

　　JavaScript 中的原型对象提供继承功能，同时也就实现了该方法实现的共享。原型也是链式的。换句话说，因为原型对象只是一个对象，所以一个原型对象可以维持到另一个原型对象的引用。如果你重新审视图 2 便可以看到，原型的 __proto__ 属性是一个指向另一个原型的非空值。当 JavaScript 查找像 push 方法这样的成员时，它会循着原型引用链检查每一个对象，直到找到该成员，或者抵达原型链的末端。原型链为继承和共享开辟了一条灵活的途径。

　　你可能会问的下一个问题是：我该如何设置那些自定义对象的原型引用呢？例如前面所使用的点对象，如何才能将 add 方法添加到原型对象中，并从多个点对象中继承方法呢？在回答这个问题之前，我们需要看看函数。

　有关函数

　　JavaScript 中的函数也是对象。这样的表述带来了几个重要的结果，而我们并不会在本文中涉及所有的事项。这其中，能将一个函数赋值给一个变量，并且将一个函数作为参数传递给另一个函数的能力构成了现代 JavaScript 编程表达的基本范式。

　　我们需要关注的是，函数本身就是对象，因此函数可以有自身的方法，属性，并且引用一个原型对象。让我们来讨论下面的代码的含义。

// 这将返回 true： typeof (Array) === "function" // 这样的表达式也是： Object.getPrototypeOf(Array) === Object.getPrototypeOf(function () { }) // 这样的表达式同样： Array.prototype != null

　　代码中的第一行证明， JavaScript 中的数组是函数。稍后我们将看到如何调用 Array 函数创建一个新的数组对象。下一行代码，证明了 Array 对象使用与任何其他函数对象相同的原型，就像我们看到数组对象间共享相同的原型一样。最后一行代码证明了 Array 函数都有一个 prototype 属性，而这个 prototype 属性指向一个有效的对象。这个 prototype 属性十分重要。

　　JavaScript 中的每一个函数对象都有 prototype 属性。千万不要混淆这个 prototype 属性的 __proto__ 属性。他们用途并不相同，也不是指向同一个对象。

// 返回 true Object.getPrototypeOf(Array) != Array.prototype

　　Array.__proto__ 提供的是 数组原型 – 请把它当作 Array 函数所继承的对象。

　　而 Array.protoype，提供的的是 所有数组的原型对象。也就是说，它提供的是像 myArray 这样数组对象的原型对象，也包含了所有数组将会继承的方法。我们可以写一些代码来证明这个事实。

// true Array.prototype == Object.getPrototypeOf(myArray) // 也是 true Array.prototype == Object.getPrototypeOf(yourArray);

　　我们也可以使用这项新知识重绘之前的示意图。

图 5