ECMA-262-3深入解析第七章：2、OOP ECMAScript 实现
ECMA-262-3深入解析第七章：2、OOP ECMAScript 实现
从来没有深入了解ECMA，网上找了一下，发现早在2010年就有大佬 Dmitry Soshnikov 总结了ECMA中的核心内容，我这里只是翻译记录，加深自己的印象。文章原文来自 ECMA-262-3 in detail. Chapter 7.2. OOP: ECMAScript implementation.
介绍
这是ECMAScript中关于面向对象编程（OOP）的第二部分。在第一部分中我们讨论了一般理论，并与ECMAScript进行了比较。在阅读这部分内容之前，如果有必要，我还是建议你先读一读OOP的第一部分，因为在本文中我们会用到第一部分的术语。你可以在这里找到：ECMA-262-3 详解：7.1、OOP一般理论
ECMAScript OOP 实现
通过一般理论的重点介绍以后，终于到了ECMAScript自身。现在，当我们知道其面向对象的方法时，我们再一次进行准确的定义：
ECMAScript是一种面向对象编程的语言，支持基于原型的委托继承。
我们才考虑数据类型开始分析。首先要注意到的就是ECMAScript区分原始值与对象上的实体。因此有时在各种文章中出现的“JavaScript中万物皆对象”的习语是不正确的（不完整的）。原始值涉及到某些类型的数据，我们详细来讨论一下。
数据类型
虽然ECMAScript是一个动态的弱类型语言，带有“鸭子”类型，以及自动类型转换，但它仍然具有某些数据类型。也就是说，某一时刻，一个对象属于一种具体类型。
标准定义了9个类型，但是在ECMAScript进程中只有6个是可以直接访问的：
- Undefined
- Null
- Boolean
- String
- Number
- Object
（译者注：当前2020年添加了Symbol以及BigInt类型）。
其他三个只有在实现级别可以访问（ECMAScript对象都不具有这种类型），并由规范用域解释某些操作行为，存储中间值等。它们是：
- Reference
- List
- Completion
因此（简要概述）, Reference 类型用于解释诸如 delete ， typeof ， this 等，并且由基础对象和属性名构成。 List 类型描述参数列表（在 new 表达式以及函数调用中）的表现。反过来， Completion 类型用域解释 break ， continue ， return 和 throw 语句行为。
回到ECMAScript程序中使用的6个类型，前面的5个： Undefined ， Null ， Boolean ， String 和 Number 是原始值类型。（译者注： Symbol 和 BigInt 也是原始值类型，也叫原始数据）。
原始值?：
var a = undefined;
var b = null;
var c = true;
var d = 'test';
var e = 10;这些值直接在底层实现中表现。他们不是对象，他们没有原型，也没有构造器。
如果不能正确理解，typeof 操作符可能就不太直观了。典型的例子就是使用 typeof 操作符操作 null。当 typeof 操作符操作 null 时，无论是否将 null 指定给 Null，结果都是 "object" 。
console.log(typeof null); // "object"原因是因为 typeof 操作符返回从标准表中获取的值，简单地说：“对于 null 值应该返回 "object" 字符串”。
规范并没有澄清此事，但是 Brendan Eich（Javascript创造者）注意到， null 与 undefined 相比， null 主要用于出现对象的地方，即与对象密切相关的本质（意味着对象的“空”引用，很可能是为未来目的保留了一个位置）。但是，在一些草稿中，这种“现象”被当作一个平常bug描述的地方提供了文档。而且，这个bug出现的Brendan Eich也参与的一个bug跟踪程序中。结果，尽管ECMA-262-3标准将 null 类型定义为 Null ，但是还是决定保留 typeof null 不变，即 "object" 。
对象类型
反过来， Object 类型（不要被 Object 构造函数混淆，我们只讨论抽象的类型）是代表ECMAScirpt对象的唯一类型。
对象是一个键值对的无序集合。
对象的键成为属性。属性是原始值与其他对象的容器。如果属性包含函数作为值，那它们被称为方法。
?：
var x = { // object "x" with three properties: a, b, c
a: 10, // primitive value
b: {z: 100}, // object "b" with property z
c: function () { // function (method)
console.log('method x.c');
}
};
console.log(x.a); // 10
console.log(x.b); // [object Object]
console.log(x.b.z); // 100
x.c(); // 'method x.c'动态性质
正如我们在7.1章节中提到的，ES中的对象是完全动态的。这就意味着我们可以在程序执行的任何时候对对象的属性进行添加，修改以及移除。
例如：
var foo = {x: 10};
// add new property
foo.y = 20;
console.log(foo); // {x: 10, y: 20}
// change property value to function
foo.x = function () {
console.log('foo.x');
};
foo.x(); // 'foo.x'
// delete property
delete foo.x;
console.log(foo); // {y: 20}一些属性不能被修改，不可配置的属性，即只读属性或者是已删除的属性。我们将在下面的章节考虑这些。
Note：ES5标准定化了静态对象，不能用新属性扩展，任何属性也不能被修改或者删除。这些成为冻结对象，可以通过 Object.freeze(o) 方法获得。
var foo = {x: 10};
// freeze the object
Object.freeze(foo);
console.log(Object.isFrozen(foo)); // true
// can't modify
foo.x = 100;
// can't extend
foo.y = 200;
// can't delete
delete foo.x;
console.log(foo); // {x: 10}而且，使用 Object.preventExtensions(o) 方法只阻止扩展也是可以的，或者，使用 Object,defineProperty(o) 方法控制特殊的属性。
var foo = {x : 10};
Object.defineProperty(foo, "y", {
value: 20,
writable: false, // read-only
configurable: false // non-configurable
});
// can't modify
foo.y = 200;
// can't delete
delete foo.y; // false
// prevent extensions
Object.preventExtensions(foo);
console.log(Object.isExtensible(foo)); // false
// can't add new properties
foo.z = 30;
console.log(foo); {x: 10, y: 20}想要了解详情，阅读这篇文章。
内置，原生与宿主对象
有必要注意的是，规范区分了本地对象，内置对象以及宿主对象。
内置对象和原生对象是由ECMAScript规范和实现定义，他们之前的区别不明显。 原生对象是ECMAScript实现提供的所有对象（其中一些可以内置，一些可以在程序执行期间创建，例如用户定义的对象）。
内置对象可以算是原生对象的一个子类，在程序开始之前已经内置到了ECMAScript中（例如 parseInt ， Math 等）。
所有的宿主对象都是由宿主环境提供，代表是浏览器，包含了许多宿主对象，例如 window ， console.log 等等。
注意，宿主对象可以使用ES自身实现，并且完全遵循规范语义。从这点来看，他们可以被叫做“原生宿主”对象（非正式的叫法），虽然主要是理论上的。规范并没有定义任何“原生宿主”的概念。
Boolean， String和Number对象
对于一些原始事物，规范定义了特殊的包装对象。他们是以下对象：
- Boolean 对象
- String 对象
- Number 对象
这些对象是由相应的内置构造函数创建的，并包含了内置属性作为原始值。对象表示的可以转行为原始值，反之亦然。
var c = new Boolean(true);
var d = new String('test');
var e = new Number(10);
console.log(typeof c); // object
console.log(typeof d); // object
console.log(typeof e); // object
// converting to primitive
// conversion: ToPrimitive
// applying as a function, without "new" keyword
с = Boolean(c);
d = String(d);
e = Number(e);
console.log(typeof c); // boolean
console.log(typeof d); // string
console.log(typeof e); // number
// back to Object
// conversion: ToObject
с = Object(c);
d = Object(d);
e = Object(e);
console.log(typeof c); // object
console.log(typeof d); // object
console.log(typeof e); // object除此之外，也有通过特殊内置对象创建的对象： Function （函数对象构造器）， Array （数组构造器）， RegExp （正则表达式构造器）， Math （数学方法）， Date （日期构造器）等等。这些对象也是 Object 类型的值，他们之前的区别是由内部属性管理的，我们将在下面讨论。
文字符号（字面符号）
对于三个对象值：object，array和regular表达式，有短记号，他们分别成为对象初始化程序，数组初始化程序与正则表达式文字：
// equivalent to new Array(1, 2, 3);
// or array = new Array();
// array[0] = 1;
// array[1] = 2;
// array[2] = 3;
var array = [1, 2, 3];
// equivalent to
// var object = new Object();
// object.a = 1;
// object.b = 2;
// object.c = 3;
var object = {a: 1, b: 2, c: 3};
// equivalent to new RegExp("^\\d+$", "g")
var re = /^\d+$/g;注意，在重新分配名称（Object，Array，或者RegExp）到新对象的情况下，后续使用文字符号的语义在实现中可能会有所不同。例如在当前（2010.3.4）Rhino实现中或者是在旧的SpiderMonkey 1.7版本中，适当的文字符号将创建一个与构造函数名称的值相对应的对象。在其他的实现中，即使构造函数名称重新绑定到新对象，也不会更改文字符号的语义：
var getClass = Object.prototype.toString;
Object = Number;
var foo = new Object;
console.log([foo, getClass.call(foo)]); // 0, "[object Number]"
var bar = {};
// in Rhino, SpiderMonkey 1.7 - 0, "[object Number]"
// in other: still "[object Object]", "[object Object]"
console.log([bar, getClass.call(bar)]);
// the same with Array name
Array = Number;
foo = new Array;
console.log([foo, getClass.call(foo)]); // 0, "[object Number]"
bar = [];
// in Rhino, SpiderMonkey 1.7 - 0, "[object Number]"
// in other: still "", "[object Object]"
console.log([bar, getClass.call(bar)]);
// but for RegExp, semantics of the literal
// isn't being changed in all tested implementations
RegExp = Number;
foo = new RegExp;
console.log([foo, getClass.call(foo)]); // 0, "[object Number]"
bar = /(?!)/g;
console.log([bar, getClass.call(bar)]); // /(?!)/g, "[object RegExp]"正则表达式字面量以及RegExp对象
注意，在ES3中，正则表达式在语义上等效的后两种情况仍然有所不同。正则字面量只存在一个实例中，并在解析阶段被创建，而 RegExp 构造函数总是会创建一个新的对象。这可能会造成一些问题，例如当regexp测试失败的时候，regexp对象的lastIndex属性：
for (var k = 0; k < 4; k++) {
var re = /ecma/g;
console.log(re.lastIndex); // 0, 4, 0, 4
console.log(re.test("ecmascript")); // true, false, true, false
}
// in contrast with
for (var k = 0; k < 4; k++) {
var re = new RegExp("ecma", "g");
console.log(re.lastIndex); // 0, 0, 0, 0
console.log(re.test("ecmascript")); // true, true, true, true
}注意：在ES5中这个问题被修复了，正则字面量也是创建一个新的对象了。
关联数组？
通常在各种文章或者讨论中，Javascript对象（通常是通过声明形式创建的对象，通过对象初始化 {}）被称为哈希表或者更简单的哈希（Ruby或者Perl中的术语），关联数组（PHP中的术语），词典（Python中的术语）。
使用这种术语是具体技术的习惯。真的，他们足够相似，并且对于“键-值”对，存储完全对应于理论上的“关联数组”或“哈希表”数据结构。而且，哈希表抽象数据类型可能并且通常是用在实现级别。
然而，虽然用术语了的描述概念上的思维方式，但是对于ECMAScript而言，从技术上而言，这是不正确的。正如之前提到的，ECMAScript仅仅只有一个对象类型，并且关于“键-值”对存储的“子类型”互不影响。因此，没有单独的特殊术语（哈希或者其他）。因为任何对象（无论它的内部属性如何）都可以存储以下对：
var a = {x: 10};
a['y'] = 20;
a.z = 30;
var b = new Number(1);
b.x = 10;
b.y = 20;
b['z'] = 30;
var c = new Function('');
c.x = 10;
c.y = 20;
c['z'] = 30;
// etc. – with any object "subtype"而且，因为委派，ECMAScript中的对象可以是非空的，因此术语“哈希”也可以是不正确的：
Object.prototype.x = 10;
var a = {}; // create "empty" "hash"
console.log(a["x"]); // 10, but it's not empty
console.log(a.toString); // function
a["y"] = 20; // add new pair to "hash"
console.log(a["y"]); // 20
Object.prototype.y = 20; // and property into the prototype
delete a["y"]; // remove
console.log(a["y"]); // but key and value are still here – 20注意，ES5标准了无须原型即可创建对象的功能，即他们的原型被设置为 null 。使用 Object.create(null) 方法实现。从这点出发，这种对象是简单的哈希表：
var aHashTable = Object.create(null);
console.log(aHashTable.toString); // undefined而且，一些属性可能有特殊的 getters/setters，因此也可能造成混淆：
var a = new String("foo");
a['length'] = 10;
console.log(a['length']); // 3但是，即使考虑到“哈希”可能具有“原型”（例如，在Ruby或者Python中，代表哈希对象的类）。在ECMAScript中这个术语也可能不正确，因为在各种属性访问器之间没有语义上的区别（例如点和括号符号）。
同样在ECMAScript中，“属性”的概念在语义上没有分为“键”， “数组索引”， “方法” 或者“属性”。在这里，他们所有都是用过检查原型链来遵守读/写算法的一般规则的属性。
下面的Ruby的例子中，我们看到语义上的区别，因此，这里这些术语可能不同：
a = {}
a.class # Hash
a.length # 0
# new "key-value" pair
a['length'] = 10;
# but semantics for the dot notation
# remains other and means access
# to the "property/method", but not to the "key"
a.length # 1
# and the bracket notation
# provides access to "keys" of a hash
a['length'] # 10
# we can augment dynamically Hash class
# with new properties/methods and they via
# delegation will be available for already created objects
class Hash
def z
100
end
end
# a new "property" is available
a.z # 100
# but not a "key"
a['z'] # nilECMA-262-3标准没有定义“哈希”（以及类似的）的概念。但是，如果要使用理论上的数据结构，也可以这样命名。
类型转换
将一个对象转换为一个原始值，可以使用 valueOf 方法。正如我们提到的，构造函数（对于某些类型）作为函数调用，例如，没有 new 操作符的情况下，将对象类型转换为一个原始值。对于这种转换，隐式调用了 valueOf 方法。
var a = new Number(1);
var primitiveA = Number(a); // implicit "valueOf" call
var alsoPrimitiveA = a.valueOf(); // explicit
console.log([
typeof a, // "object"
typeof primitiveA, // "number"
typeof alsoPrimitiveA // "number"
]);这个方法运行对象参与各种操作，例如，相加：
var a = new Number(1);
var b = new Number(2);
console.log(a + b); // 3
// or even so
var c = {
x: 10,
y: 20,
valueOf: function () {
return this.x + this.y;
}
};
var d = {
x: 30,
y: 40,
// the same .valueOf
// functionality as "с" object has,
// borrow it:
valueOf: c.valueOf
};
console.log(c + d); // 100默认情况下， valueOf 方法的值（如果没有被覆盖）可以根据对象类型有所不同。对于一些对象返回的是 this 值，例如 Object.prototype.valueOf() ，对于其他的返回任何可计算的值。例如 Date.prototype.valueOf() ，返回的是date的时间：
var a = {};
console.log(a.valueOf() === a); // true, "valueOf" returned this value
var d = new Date();
console.log(d.valueOf()); // time
console.log(d.valueOf() === d.getTime()); // true另外，还有一个对象的原始表示形式 — 字符串表示形式。这个由 toStirng 方法负责，在一些操作中也是自动执行：
var a = {
valueOf: function () {
return 100;
},
toString: function () {
return '__test';
}
};
// in this operation
// toString method is
// called automatically
console.log(a); // "__test" 注意：在最新的 chrome 中 并不是作者说的这个值 而是 对象 a
// but here - the .valueOf() method
console.log(a + 10); // 110
// but if there is no
// valueOf method, it
// will be replaced with the
//toString method
delete a.valueOf;
console.log(a + 10); // "_test10"toString 方法定义在 Object.prototype 上，有着特殊的意义。他返回了内置的 [[Class]] 属性的值，我们将在下面讨论这个值。
除了 ToPrimitive 转换外，还有 ToObject 转换，反之亦然，将值转换为对象类型。
一个明确的调用 ToObject 的方法就是将内置的 Object 构造函数作为普通函数调用（对于某些类型，使用带有 new 操作符的 Object 也是可能的）：
var n = Object(1); // [object Number]
var s = Object('test'); // [object String]
// also for some types it is
// possible to call Object with new operator
var b = new Object(true); // [object Boolean]
// but applied without arguments,
// new Object creates a simple object
var o = new Object(); // [object Object]
// in case if argument for Object function
// is already object value,
// it simply returns
var a = [];
console.log(a === new Object(a)); // true
console.log(a === Object(a)); // true就带有 new 与不带有 new 操作符调用内置构造函数而言，没有通用规则，这取决于构造函数。例如 Array 和 Function 构造函数，在作为一个构造函数调用（有 new ）和作为普通函数（没有 new ）调用提供相同的结果。
var a = Array(1, 2, 3); // [object Array]
var b = new Array(1, 2, 3); // [object Array]
var c = [1, 2, 3]; // [object Array]
var d = Function(''); // [object Function]
var e = new Function(''); // [object Function]运用某些操作的时候，还存在显示与隐式的转换：
var a = 1;
var b = 2;
// implicit
var c = a + b; // 3, number
var d = a + b + '5' // "35", string
// explicit
var e = '10'; // "10", string
var f = +e; // 10, number
var g = parseInt(e, 10); // 10, number
// etc.属性的属性
属性的属性
所有的属性都有大量的属性：
{readOnly}：尝试重写属性值是被忽略的；但是ReadOnly属性可以被宿主环境操作修改，因此，ReadOnly不意味着“不变的值”。{DontEnum}：属性不能通过for...in循环枚举{DontDelete}：delete操作用于该属性将被忽视{Internal}：属性是内部的，没有名字并且只能用域实现级别；这类属性不能在ECMAScript程序中访问。
注意，在ES5中{ReadOnly}, {DontEnum} and {DontDelete} 被重命名为相应的 [[Writable]] , [[Enumerable]] ， [[Configurable]] 并且可以通过 Object.defineProperty 和相似的方法手动管理。
var foo = {};
Object.defineProperty(foo, "x", {
value: 10,
writable: true, // aka {ReadOnly} = false
enumerable: false, // aka {DontEnum} = true
configurable: true // {DontDelete} = false
});
console.log(foo.x); // 10
// attributes set is called a descriptor
var desc = Object.getOwnPropertyDescriptor(foo, "x");
console.log(desc.enumerable); // false
console.log(desc.writable); // true
// etc.内部属性与方法
对象也可以拥有大量的内部属性，这些属性是实现的一部分，不能直接供ECMAScript程序访问（但是正如我们下面将看到的，某些实现是允许访问这些属性的）。按照约定，这些属性用双方括号 [[]] 括起来。
我们将会接触到一些（所有对象都是必须的）；其他属性的描述可以在规范中找到。
每个对象都应该实现以下的内部属性与方法：
[[Prototype]]：对象的原型（将会在下面详细说明）。[[Class]]：一个代表对象类型的字符串（例如：Object，Array，Function等等）；用于区分对象。[[Get]]：用于获取属性值的方法[[Put]]：用于设置属性值的方法[[CanPut]]： 检测是否可以重写属性[[HasProperty]]：检测对象是否已经拥有这个属性[[Delete]]：从对象中移除属性[[DefaultValue]]：返回与对象相应的原始值（对于获取值，valueOf方法被调用，对于一些对象，抛出TypeError异常）。
要从ECMAScript程序中获得 [[Class]] 属性，通过 Object.property.toString() 方法可以间接获得。这个方法可以返回如下字符串 "[Object " + [[Class]] + "]" 。例如：
var getClass = Object.prototype.toString;
getClass.call({}); // [object Object]
getClass.call([]); // [object Array]
getClass.call(new Number(1)); // [object Number]
// etc.这个特征常用于检测对象的类型，然而，有必要注意的是，通过规范，宿主对象的内部 [[Class]] 属性可以是任何值，包括内置对象的 [[Class]] 值，从理论上将，不会进行100%证明的这种检查。例如，在老版本的IE中， document.childNodes.item(...) 方法的 [[Class]] 属性返回 "String" （在其他的实现中，返回 "Function"）
// in older IE - "String", in other - "Function"
console.log(getClass.call(document.childNodes.item));构造函数
我们上面提及到，ECMAScript中对象是通过叫做构造函数的东西创建的。
构造函数是一个创建与初始化新创建对象的函数。
对于创建（内存分配），由构造函数内部的 [[Constuct]] 方法负责。指定了这个内部方法的行为，并且所有构造函数都使用这种方法为新对象分配内存。
通过在新创建的对象的上下文中调用函数来管理初始化。构造函数中已经存在的内部 [[Call]] 方法负责此行为。
注意，用户代码中只能访问初始阶段。因此，即使从初始化开始，我们可以忽略第一步中创建的 this 对象返回不同的对象：
function A() {
// update newly created object
this.x = 10;
// but return different object
return [1, 2, 3];
}
var a = new A();
console.log(a.x, a); undefined, [1, 2, 3]定位到第五章函数中讲到的函数对象的创建法则，我们看到函数是一个本地对象，除其他属性外，还有内部的 [[Construct]] 和 [[Call]] 属性以及显示的 原型 属性 — 对未来对象原型的引用（注意，这里以及下面的 NativeObject 是我对ECMA-262-3中”本地对象”的伪代码命名约定，但不是内置构造函数）。
F = new NativeObject();
F.[[Class]] = "Function"
.... // other properties
F.[[Call]] = <reference to function> // function itself
F.[[Construct]] = internalConstructor // general internal constructor
.... // other properties
// prototype of objects created by the F constructor
__objectPrototype = {};
__objectPrototype.constructor = F // {DontEnum}
F.prototype = __objectPrototype因此，除了 [[Class]] 属性（等同于 "Function"）之外的 [[Call]] 是区分对象的主要方法。因此，具有内部 [[Call]] 属性的对象被称为 functions。对于这些对象， typeof 操作符返回 "function" 值。因此，它主要与本地对象有关，在主机可以调用对象的情况下，某些实现中的 typeof 操作符（不少于 [[Class]] 属性）可能返回其他的值，例如，在IE中的 window.console.log(...)：
// in IE - "Object", "object", in other - "Function", "function"
console.log(Object.prototype.toString.call(window.console.log));
console.log(typeof window.console.log); // "Object"内部的 [[Construct]] 方法由用于构造函数的 new 操作符激活。正如我们说的，这个方法负责内存分配以及新对象的创建。如果没有参数，则可以省略构造函数的括号：
function A(x) { // constructor А
this.x = x || 10;
}
// without arguments, call
// brackets can be omitted
var a = new A; // or new A();
console.log(a.x); // 10
// explicit passing of
// x argument value
var b = new A(20);
console.log(b.x); // 20并且，构造函数（初始阶段）中的this值被设置为新创建的这个对象。
我们来细想一下对象创建的计算规则。
对象创建的计算规则
内部的 [[Constuct]] 方法的行为可以被表示为：
F.[[Construct]](initialParameters):
O = new NativeObject();
// property [[Class]] is set to "Object", i.e. simple object
O.[[Class]] = "Object"
// get the object on which
// at the moment references F.prototype
var __objectPrototype = F.prototype;
// if __objectPrototype is an object, then:
O.[[Prototype]] = __objectPrototype
// else:
O.[[Prototype]] = Object.prototype;
// where O.[[Prototype]] is the prototype of the object
// initialization of the newly created object
// applying the F.[[Call]]; pass:
// as this value – newly created object - O,
// arguments are the same as initialParameters for F
R = F.[[Call]](initialParameters); this === O;
// where R is the returned value of the [[Call]]
// in JS view it looks like:
// R = F.apply(O, initialParameters);
// if R is an object
return R
// else
return O注意两个主要的特征：
第一，创建对象的 prototype 属性是来自于当前时刻函数的 prototype 属性（这就意味着从一个构造函数创建的两个对象的属性可以改变，因为函数的 prototype 属性也可以改变）。
第二，我们上面提到，如果在对象初始时 [[Call]] 返回了一个对象，则将其作为整个 new 表达式的结果：
function A() {}
A.prototype.x = 10;
var a = new A();
console.log(a.x); // 10 – by delegation, from the prototype
// set .prototype property of the
// function to new object; why explicitly
// to define the .constructor property,
// will be described below
A.prototype = {
constructor: A,
y: 100
};
var b = new A();
// object "b" has new prototype
console.log(b.x); // undefined
console.log(b.y); // 100 – by delegation, from the prototype
// however, prototype of the "a" object
// is still old (why - we will see below)
console.log(a.x); // 10 - by delegation, from the prototype
function B() {
this.x = 10;
return new Array();
}
// if "B" constructor had not return
// (or was return this), then this-object
// would be used, but in this case – an array
var b = new B();
console.log(b.x); // undefined
console.log(Object.prototype.toString.call(b)); // [object Array]我们再来深入的了解一下原型。
Prototype
每一个对象都含有一个原型（某些系统对象可以例外）。通过内部的，隐式的和不可访问的 [[Protorype]] 属性来组织与原型的通信。一个属性可以是一个对象也可以是一个 null 对象。
Property constructor
在上面的例子中有两点很重要。第一与函数prototype属性的构造函数属性有关。
正如我们在函数对象创建算法中看到的，在函数创建阶段， constructor 属性设置到函数的 prototype 属性中。此属性的值是对函数本身的循环引用：
function A() {}
var a = new A();
console.log(a.constructor); // function A() {}, by delegation
console.log(a.constructor === A); // true通常这种情况下有误解 — constructor 属性错误的被当作创建对象的自身属性。然而，正如我们所看到的，这个属性属于原型，并且通过继承访问对象。
通过继承的 constructor 属性实例可以间接的获取原型对象的引用：
function A() {}
A.prototype.x = new Number(10);
var a = new A();
console.log(a.constructor.prototype); // [object Object]
console.log(a.x); // 10, via delegation
// the same as a.[[Prototype]].x
console.log(a.constructor.prototype.x); // 10
console.log(a.constructor.prototype.x === a.x); // true注意，函数的 constructor 和 prototype 可以在对象创建后重新定义。这种情况下，对象失去通过上面机制的引用。
如果我们在原来的原型中通过函数的prototype 属性添加新的或者修改已经存在的属性，实例将会看到最新的添加的属性。
但是，如果我们完全修改了函数的prototype 属性（通过赋值一个新对象），失去原来构造函数（以及原来的原型）的引用。这是因为新创建的对象没有constructor 属性。
function A() {}
A.prototype = {
x: 10
};
var a = new A();
console.log(a.x); // 10
console.log(a.constructor === A); // false!因此，引用应该手动修复：
function A() {}
A.prototype = {
constructor: A,
x: 10
};
var a = new A();
console.log(a.x); // 10
console.log(a.constructor === A); // true注意，手动添加的 constructor 属性与原来的相比，没有 {DontEnum} 属性，结果就是，在 A.prototype 中可以通过 for...in 循环枚举：
ES5中引入了通过[[Enumerable]]属性控制属性的可枚举状态的能力。
var foo = {x: 10};
Object.defineProperty(foo, "y", {
value: 20,
enumerable: false // aka {DontEnum} = true
});
console.log(foo.x, foo.y); // 10, 20
for (var k in foo) {
console.log(k); // only "x"
}
var xDesc = Object.getOwnPropertyDescriptor(foo, "x");
var yDesc = Object.getOwnPropertyDescriptor(foo, "y");
console.log(
xDesc.enumerable, // true
yDesc.enumerable // false
);显示 prototype 与隐式的 [[Prototype]] 属性
通过函数的prototype属性直接引用原型，通常对象的原型被错误的混淆。是的，真的，他引用了相同的对象，即对象的 [[Prototype]] 属性：
a.[[Prototype]] ----> Prototype <---- A.prototype而且，在对象创建阶段，实例的 [[Prototype]] 完全从构造函数的prototype属性上获取值。
然而，替换构造函数的prototype属性不影响已经创建的对象的原型。仅仅只是它的构造函数的prototype属性改变了。这意味着新对象会有一个新的原型。但是已经创建的对象（在 prototype 属性修改之前），拥有旧的原型的引用，并且引用不能被修改。
// was before changing of A.prototype
a.[[Prototype]] ----> Prototype <---- A.prototype
// became after
A.prototype ----> New prototype // new objects will have this prototype
a.[[Prototype]] ----> Prototype // reference to old prototype?：
function A() {}
A.prototype.x = 10;
var a = new A();
console.log(a.x); // 10
A.prototype = {
constructor: A,
x: 20
y: 30
};
// object "а" delegates to
// the old prototype via
// implicit [[Prototype]] reference
console.log(a.x); // 10
console.log(a.y) // undefined
var b = new A();
// but new objects at creation
// get reference to new prototype
console.log(b.x); // 20
console.log(b.y) // 30因此，有时候在关于JavaScript的文章中会出现声明，声称“动态修改原型将会影响所有的对象，并且他们将会拥有新的原型”是错误的。新的原型只有在这个修改以后创建的新对象才有。
这里主要的规则是：对象的原型是在对象创建那一刻设置的，并且在那之后不能被修改为新对象。如果构造函数仍引用相同的对象，则使用该对象的显示原型引用，只能添加新的属性或者修改对象原型已经存在的属性。
非标准的 __proto__ 属性
然而，一些实现中，例如，SpiderMonkey，通过非标准的 __proto__ 属性提供对象原型的显示引用：
function A() {}
A.prototype.x = 10;
var a = new A();
console.log(a.x); // 10
var __newPrototype = {
constructor: A,
x: 20,
y: 30
};
// reference to new object
A.prototype = __newPrototype;
var b = new A();
console.log(b.x); // 20
console.log(b.y); // 30
// "a" object still delegates
// to the old prototype
console.log(a.x); // 10
console.log(a.y); // undefined
// change prototype explicitly
a.__proto__ = __newPrototype;
// now "а" object references
// to new object also
console.log(a.x); // 20
console.log(a.y); // 30注意，ES5中引进了 Object.getPrototypeOf(o) 方法，直接返回对象的 [[Prototype]] 属性 — 实例原来的属性。但是，与 __proto__ 相比，作为一个 getter ，他不被允许设置属性。
var foo = {};
Object.getPrototypeOf(foo) == Object.prototype; // true对象独立于其构造函数
因为实例的原型独立于构造函数和构造函数的prototype属性，构造函数在完成它的主要目的（创建对象）后，可以移除。原型对象将会继续存在，通过 [[Prototype]] 属性被引用。
function A() {}
A.prototype.x = 10;
var a = new A();
console.log(a.x); // 10
// set "А" to null - explicit
// reference on constructor
A = null;
// but, still possible to create
// objects via indirect reference
// from other object if
// .constructor property has not been changed
var b = new a.constructor();
console.log(b.x); // 10
// remove implicit reference
// after it `a.constructor`, and `b.constructor`
// will point to the default Object function, but not `A`
delete a.constructor.prototype.constructor;
// it is not possible to create objects
// of "А" constructor anymore, but still
// there are two such objects which
// still have reference to their prototype
console.log(a.x); // 10
console.log(b.x); // 10instanceof 操作的特征
通过构造函数的prototype属性显示引用原型，与 instanceof 操作符的工作相关。
该操作符与对象的原型链完全协同工作，但不与构造函数本身协同工作。考虑到这一点，因为这里经常有误解。因此，有一个检查：
if (foo instanceof Foo) {
...
}这并不意味着检查 foo 对象是否由 Foo 构造函数创建。
instanceof 操作符的所有工作只是获取 Foo.prototype 属性的值以及从 foo.[[Prototype]] 开始检查 foo 的作用域链是否存在。 instanceof 操作符是由构造函数内部的 [[HasInstace]] 方法激活。
从例子出发来看看：
function A() {}
A.prototype.x = 10;
var a = new A();
console.log(a.x); // 10
console.log(a instanceof A); // true
// if set A.prototype
// to null...
A.prototype = null;
// ...then "a" object still
// has access to its
// prototype - via a.[[Prototype]]
console.log(a.x); // 10
// however, instanceof operator
// can't work anymore, because
// starts its examination from the
//prototype property of the constructor
console.log(a instanceof A); // error, A.prototype is not an object另一方面，可以由一个构造函数创建对象，但是通过另一个对象检测 instanceof 将会返回 true 。很有必要设置对象的 [[Prototype]] 属性和构造函数的 prototype 属性到相同的对象：
function B() {}
var b = new B();
console.log(b instanceof B); // true
function C() {}
var __proto = {
constructor: C
};
C.prototype = __proto;
b.__proto__ = __proto;
console.log(b instanceof C); // true
console.log(b instanceof B); // false原型作为方法和共享属性的存储
在ECMAScript中原型 最有用的应用是存储对象的方法、默认状态和共享属性。
的确，对象可以拥有自己的状态，当时方法通常都是相同的。因此，为了优化内存使用，方法通常被定义在原型上面。这意味着所有通过构造函数创建的实例总是共享相同的方法。
function A(x) {
this.x = x || 100;
}
A.prototype = (function () {
// initializing context,
// use additional object
var _someSharedVar = 500;
function _someHelper() {
console.log('internal helper: ' + _someSharedVar);
}
function method1() {
console.log('method1: ' + this.x);
}
function method2() {
console.log('method2: ' + this.x);
_someHelper();
}
// the prototype itself
return {
constructor: A,
method1: method1,
method2: method2
};
})();
var a = new A(10);
var b = new A(20);
a.method1(); // method1: 10
a.method2(); // method2: 10, internal helper: 500
b.method1(); // method1: 20
b.method2(); // method2: 20, internal helper: 500
// both objects are use
// the same methods from
// the same prototype
console.log(a.method1 === b.method1); // true
console.log(a.method2 === b.method2); // true读写属性
我们提到，属性的读写是由内部的 [[Get]] 和 [[Put]] 方法管理。这个方法由属性访问器即操符号和括号符号激活。
// write
foo.bar = 10; // [[Put]] is called
console.log(foo.bar); // 10, [[Get]] is called
console.log(foo['bar']); // the same让我们用伪代码来展示这些方法的工作原理。
[[Get]] 方法
[[Get]] 方法也会考虑到来自对象作用域链的属性。因此原型的属性可以作为自己的对象方法。
O.[[Get]](P):
// 如果有自己的属性，返回他
if (O.hasOwnProperty(P)) {
return O.P;
}
// 否则分析属性
var __proto = O.[[Prototype]];
// 如果没有原型 (这是可能的，在链的最后，
// Object.prototype.[[Prototype]]等于null),
// 返回undefined;
if (__proto === null) {
return undefined;
}
// 否则，递归调用[[Get]]方法，从原型开始，用过原型链找到原型的属性，
// 此后继续 直到[[Prototype]]等于null
return __proto.[[Get]](P)注意，因为在某些情况下 [[Get]] 方法返回 undefined ，因此可以检查变量是否存在，像下面这样：
if (window.someObject) {
...
}这里，属性 someObject 没有在 window 中找到，接着在它的原型找，在原型的原型找，依次递归，在这种情况下，一直没找到，通过算法，返回 undefined 值。
注意，对于确切存在这件事，由 in 操作符负责。他也包含了原型链：
if ('someObject' in window) {
...
}它有助于避免某些情况，例如 someObject 等于 false 以及即使 someObject 存在也不会通过第一次检测。
[[Put]] 方法
相反，[[Put]] 方法创建或者更新对象的自身属性，并用原型中相同的名字遮盖属性。
O.[[Put]](P, V):
// 如果我们不能写入属性，则退出
if (!O.[[CanPut]](P)) {
return;
}
// 如果对象没有这些属性，创建它，所有属性都设置为false
if (!O.hasOwnProperty(P)) {
createNewProperty(O, P, attributes: {
ReadOnly: false,
DontEnum: false,
DontDelete: false,
Internal: false
});
}
// 设置值，如果属性存在，它的属性不能修改
O.P = V
return;例如：
Object.prototype.x = 100;
var foo = {};
console.log(foo.x); // 100, inherited
foo.x = 10; // [[Put]]
console.log(foo.x); // 10, own
delete foo.x;
console.log(foo.x); // again 100, inherited注意：有可能隐藏内部的只读属性。分配结果将被忽略。这个被内部的 [[CanPut]] 方法控制
// For example, property "length" of
// string objects is read-only; let's make a
// string as a prototype of our object and try
// to shadow the "length" property
function SuperString() {
/* nothing */
}
SuperString.prototype = new String("abc");
var foo = new SuperString();
console.log(foo.length); // 3, the length of "abc"
// try to shadow
foo.length = 5;
console.log(foo.length); // still 3在ES5的严格模式下，尝试隐藏不可写属性会导致TypeError。
属性访问器
在ECMAScript中，内部的 [[Get]] 和 [[Put]] 方法由属性访问器激活，可以通过点符号或者通过括号符号获得。点符号被用于属性名是一个有效的标识符名字以及提前知道的时候，括号符号允许动态生成的属性名称。
var a = {testProperty: 10};
console.log(a.testProperty); // 10, dot notation
console.log(a['testProperty']); // 10, bracket notation
var propertyName = 'Property';
console.log(a['test' + propertyName]); // 10, bracket notation with dynamic property有一个很重要的特征 — 属性访问器总是从属性访问器调用位于左侧的对象的 ToObject 转换。并且由于隐式转换，可能被粗糙的说成“JavaScript一切皆对象”（但是，正如我们早就知道的，当然不是所有的东西，因为还有原始的东西）。
如果我们将属性访问器与原始值一起使用，只需要创建具有相应值的中间包装对象。工作完成后，移除这个包装对象。
?：
var a = 10; // 原始值
// 但是它有方法，就像他是一个对象
console.log(a.toString()); // "10"
// moreover, we can even
// (try) to create a new
// property in the "а" primitive calling [[Put]]
// 而且，我们甚至可以尝试在a上创建一个新属性，调用了原始的 [[Put]]
a.test = 100; // 没有报错，这个生效了
// 但是， [[Get]] 方法没有返回这个属性值，而是返回了 undefined
console.log(a.test); // undefined所以，为什么在这个例子中，原始值 a 可以访问 toString 方法，但是不能访问新创建的 test 属性呢？
答案很简单：
首先，正如我们说的，应用属性访问器后，就不再是原始的，而是中间对象。在这个例子中， new Number(a) 使用了，通过算法找到了作用域链中的 toString 方法。
// 计算 a.toString() 的算法
1. wrapper = new Number(a);
2. wrapper.toString(); // "10"
3. delete wrapper;接下来，当计算 test 属性的时候， [[Put]] 方法也会创建自己的中间对象：
// 计算 a.test = 100 的算法
1. wrapper = new Number(a);
2. wrapper.test = 100;
3. delete wrapper;我们看到在第三步中中间对象是被删除了，同时新创建的 test 对象当然会随着对象的移除而移除。
接着，调用 [[Get]] 方法，其中属性访问器再次创建新的包装对象，该包装对象当然对任何 test 属性都不知道：
// 计算 a.test 的算法
1. wrapper = new Number(a);
2. wrapper.test; // undefined也就是说，从原语值引用属性/方法只对读取属性有意义。另外，如果任何一个原始值经常使用对属性的访问，为了节省时间资源，有一种直接用对象表示替换它的感觉。相反，如果值只参与一些不要求访问属性的小计算，则可以使用更有效的原始值。
继承
众所周知，ECMAScript使用基于原型的委托继承。
链接，原型生成时已经提到的原型链。
实际上，所有用域实现委托和原型链分析的工作都简化为上述的 [[Get]] 方法的工作。
如果你完全理解了 [[Get]] 方法的简单算法，Javascript中继承的问题将会自己消失，并且答案将会很清晰明了。
通常在论坛上当谈及关于JavaScript的继承的时候，我只展示一行ECMAScript代码的例子，非常精准明确的描述了这门语言对象的结构，并且展示了基于原型的委托。的确，我们不需要创建任何构造函数或者对象，整个语言都已经继承了。这行代码非常简单：
console.log(1..toString()); // "1"现在我们知道了 [[Get]] 方法和属性访问器的算法，我们可以看看这里发生了什么：
- 首先，因为原始值
1，new Number(1)作为中间对象被创建了； - 接着继承的
toString方法从中间对象调用。
为什么是继承的？因为ECMASCript中对象有自己的属性，并且创建的中间对象，在这里没有自己的 toString 方法。因此，它从原型上继承，即 Number.prototype 。
注意语法的微妙情况。上面例子中的两个点不是错误，第一个点用于数字的小数部分，第二个点是属性访问器：
1.toString(); // SyntaxError!
(1).toString(); // OK
1 .toString(); // OK (space after 1)
1..toString(); // OK
1['toString'](); // OK原型链
我们来展示如何为用户定义的对象创建作用域链。相当简单：
function A() {
console.log('A.[[Call]] activated');
this.x = 10;
}
A.prototype.y = 20;
var a = new A();
console.log([a.x, a.y]); // 10 (own), 20 (inherited)
function B() {}
// the easiest variant of prototypes
// chaining is setting child
// prototype to new object created,
// by the parent constructor
B.prototype = new A();
// fix .constructor property, else it would be А
B.prototype.constructor = B;
var b = new B();
console.log([b.x, b.y]); // 10, 20, both are inherited
// [[Get]] b.x:
// b.x (no) -->
// b.[[Prototype]].x (yes) - 10
// [[Get]] b.y
// b.y (no) -->
// b.[[Prototype]].y (no) -->
// b.[[Prototype]].[[Prototype]].y (yes) - 20
// where b.[[Prototype]] === B.prototype,
// and b.[[Prototype]].[[Prototype]] === A.prototype此方法具有两个特点。
第一， B.prototype 将会包含 x 属性。乍一看，像是不正确，因为 x 属性是作为 A 自身属性定义，并预期在 B 构造函数对象中也是自己的。
在原型继承的情况下，这是正确情况，因为后代对象如果没有这样属于自己的属性，将会委托给原型。背后的想法是，由 B 构造函数创建的对象不需要 x 属性。相反，在基于类模型中，所有的属性都复制到类后代。
但是，如果仍然需要（模拟基于类的方法）由 B 构造函数创建的对象拥有 x 属性，则对此有一些方法，我们将在下面显示其中一种方法。
第二，这已经不是功能而是缺点，当后代原型被创建，构造函数的代码也会执行。我们可以看到 A.[[Call]] activated 消息显示了两次，当 A 构造函数创建的对象被用于 B.prototype 的时候，以及对象创建时 a 对象自身。
一个更关键的例子是父构造函数中抛出的异常：对于这个构造函数创建的实际对象，可能需要这样的检查，但显然，使用这些父对象作为原型是完全不可接受的：
function A(param) {
if (!param) {
throw 'Param required';
}
this.param = param;
}
A.prototype.x = 10;
var a = new A(20);
console.log([a.x, a.param]); // 10, 20
function B() {}
B.prototype = new A(); // Error除此之外，父级构造函数中的大量计算可以视为此方法的缺点。
要解决这些“特点”和问题，现在的程序员使用标准模式来连接原型，我面下面将看到的。这个技巧的主要目标是创建中间包装器构造函数，链接所需的原型。
function A() {
console.log('A.[[Call]] activated');
this.x = 10;
}
A.prototype.y = 20;
var a = new A();
console.log([a.x, a.y]); // 10 (own), 20 (inherited)
function B() {
// or simply A.apply(this, arguments)
B.superproto.constructor.apply(this, arguments);
}
// inheritance: chaining prototypes
// via creating empty intermediate constructor
var F = function () {};
F.prototype = A.prototype; // reference
B.prototype = new F();
B.superproto = A.prototype; // explicit reference to ancestor prototype, "sugar"
// fix .constructor property, else it would be A
B.prototype.constructor = B;
var b = new B();
console.log([b.x, b.y]); // 10 (own), 20 (inherited)注意我们是如何在 b 实例上创建自己的 x 属性的：在新创建对象的上面我中，我们通过 B.superproto.constructor 引用调用父级构造函数。
我们也修复了无须使用父级构造函数来创建后代原型的问题。现在，当需要的时候， "A.[[Call]].activated" 消息会显示。
而且不要每次都重复原型链的相同操作（创建中间构造器，设置 superproto 糖，恢复原来的 constructor 等），这个模板可以封装在方便的工具函数中，不管构造函数的名字是什么，目的都是链接原型：
function inherit(child, parent) {
var F = function () {};
F.prototype = parent.prototype
child.prototype = new F();
child.prototype.constructor = child;
child.superproto = parent.prototype;
return child;
}相应的，继承：
function A() {}
A.prototype.x = 10;
function B() {}
inherit(B, A); // chaining prototypes
var b = new B();
console.log(b.x); // 10, found in the A.prototype这种包装有很多变种（关于语法方面），但是，所有这些都简化为上述描述。
例如，如果我们将中间构造函数放在外面（因此，只有一个函数会被创建）， 可以优化之前的包装，从而重用之前的：
var inherit = (function(){
function F() {}
return function (child, parent) {
F.prototype = parent.prototype;
child.prototype = new F;
child.prototype.constructor = child;
child.superproto = parent.prototype;
return child;
};
})();因为对象的真实的原型是 [[Prototype]] 属性，这意味着 F.prototype 可以被轻易的修改与重用，因为通过 new F 创建的 child.prototype 将会从 child.prototype 的当前值获得他的 [[Prototype]] 。
function A() {}
A.prototype.x = 10;
function B() {}
inherit(B, A);
B.prototype.y = 20;
B.prototype.foo = function () {
console.log("B#foo");
};
var b = new B();
console.log(b.x); // 10, is found in A.prototype
function C() {}
inherit(C, B);
// and using our "superproto" sugar
// we can call parent method with the same name
C.prototype.foo = function () {
C.superproto.foo.call(this);
console.log("C#foo");
};
var c = new C();
console.log([c.x, c.y]); // 10, 20
c.foo(); // B#foo, C#foo注意，ES5标准化了这个工具函数，以实现更好的链接。它就是 Object.create 方法。
ES3中的简化版本几乎可以通过以下方式实现：
Object.create ||
Object.create = function (parent, properties) {
function F() {}
F.prototype = parent;
var child = new F;
for (var k in properties) {
child[k] = properties[k].value;
}
return child;使用：
var foo = {x: 10};
var bar = Object.create(foo, {y: {value: 20}});
console.log(bar.x, bar.y); // 10, 20关于详情查看这篇文章。
同样，“JS中的经典继承”的现有的所有模仿形式都是基于这个原理。现在我们看到，实际上它甚至不是一个“基于模仿类的继承”，而只是原型链简单的代码重用。
注意：在ES6中“class”的概念标准化了，并被实现为如上所述的构造函数之上的语法糖。从这点出发，原型链变成了基于类继承的实现：
// ES6
class Foo {
constructor(name) {
this._name = name;
}
getName() {
return this._name;
}
}
class Bar extends Foo {
getName() {
return super.getName() + ' Doe';
}
}
var bar = new Bar('John');
console.log(bar.getName()); // John Doe