你不知道的JavaScript（上）this和对象原型（四）原型

五章 原型

1、[[ Prototype ]]

JavaScript 中的对象有一个特殊的 [[Prototype]] 内置属性，其实就是对于其他对象的引用。几乎所有的对象在创建时 [[Prototype]] 属性都会被赋予一个非空的值。

对于默认的 [[Get]] 操作来说，如果无法在对象本身找到需要的属性，就会继续访问对象
的 [[Prototype]] 链：

 var anotherObject = {
 a:2
 };
 // 创建一个关联到 anotherObject 的对象
 var myObject = Object.create( anotherObject );
 myObject.a; //

还有另外一种方法，就是使用for..in遍历对象时原理，和查找[[ Prototype ]]链想死，任何可以通过原型链访问到的属性都会被枚举。使用in操作符来检查属性在对象中是否存在也会查找对象的整条原型链（无论属性是否可枚举）

var anotherObject = {
a:2
};
// 创建一个关联到 anotherObject 的对象
var myObject = Object.create( anotherObject );
for (var k in myObject) {
console.log("found: " + k);
}
// found: a
("a" in myObject); // true

2、“构造函数“

在 JavaScript 中对于“构造函数”最准确的解释是，所有带 new 的函数调用。函数不是构造函数，但是当且仅当使用 new 时，函数调用会变成“构造函数调用”。

 function NothingSpecial() {
 console.log( "Don't mind me!" );
 }
 var a = new NothingSpecial();
 // "Don't mind me!"
 a; // {}

3、原型继承【重点】

图中由下到上的箭头表明这是委托关联，不是复制操作。

典型的“原型风格”，例子如下：

 function Foo(name) {
 this.name = name;
 }
 Foo.prototype.myName = function() {
 return this.name;
 };
 function Bar(name,label) {
 Foo.call( this, name );
 this.label = label;
 }
 // 我们创建了一个新的 Bar.prototype 对象并关联到 Foo.prototype
 Bar.prototype = Object.create( Foo.prototype );
 // 注意！现在没有 Bar.prototype.constructor 了
 // 如果你需要这个属性的话可能需要手动修复一下它
 Bar.prototype.myLabel = function() {
 return this.label;
 };
 var a = new Bar( "a", "obj a" );
 a.myName(); // "a"
 a.myLabel(); // "obj a"

核心部分就是语句 Bar.prototype = Object.create( Foo.prototype ) 。调用Object.create(..) 会凭空创建一个“新”对象并把新对象内部的 [[Prototype]] 关联到你指定的对象（本例中是 Foo.prototype ）。但是 Object.create(..)唯一的缺点就是需要创建一个新对象然后把旧对象抛弃掉，不能直接修改已有的默认对象。

ES6添加了一个辅助函数Object.setPrototypeOf(..) ，可以用标准并且可靠的方法来修改关联。

对比一下两种关联的方法

 // ES6 之前需要抛弃默认的 Bar.prototype
 Bar.ptototype = Object.create( Foo.prototype );
 // ES6 开始可以直接修改现有的 Bar.prototype
 Object.setPrototypeOf( Bar.prototype, Foo.prototype );

4、检查“类”的关系

寻找对象a委托的对象，也就是检查一个实例（js中的对象）的继承祖先（js中的委托关联）被称为内省（或者反射）

例子

 function Foo() {
 // ...
 }
 Foo.prototype.blah = ...;
 var a = new Foo();

方法一  （instanceof）

instanceof 操作符的左操作数是一个普通的对象，右操作数是一个函数。 instanceof 回答的问题是：在 a 的整条 [[Prototype]] 链中是否有指向 Foo.prototype 的对象？可是，这个方法只能处理对象（ a ）和函数（带 .prototype 引用的 Foo ）之间的关系。如果你想判断两个对象（比如 a 和 b ）之间是否通过 [[Prototype]] 链关联，只用 instanceof无法实现

a instanceof Foo; // true

方法二

在本例中，我们实际上并不关心（甚至不需要） Foo ，我们只需要一个可以用来判断的对象（本例中是 Foo.prototype ）就行。 isPrototypeOf(..) 回答的问题是：在 a 的整条 [[Prototype]] 链中是否出现过 Foo.prototype ？

Foo.prototype.isPrototypeOf( a ); // true

 5、创建关联

Object.create() 的polyfill代码。这段 polyfill 代码使用了一个一次性函数 F ，我们通过改写它的 .prototype 属性使其指向想要关联的对象，然后再使用 new F() 来构造一个新对象进行关联。

 if (!Object.create) {
 　　Object.create = function(o) {
 　　function F(){}
 　　F.prototype = o;
 　　return new F();
 　　};
 }

 第六章 行为委托

重点：对象关联

 Foo = {
               init:function(who){
                   this.me=who;
               },
               identify:function(){
                   return "i am "+this.me;
               }
           };
           Bar = Object.create(Foo);
           Bar.speak = function(){
               console.log("hello"+this.identify()+".");
           }
           var b1 = Object.create(Bar);
           b1.init("b1");
           var b2 = Object.create(Bar);
           b2.init("b2");
           b1.speak();
           b2.speak();

ES6 使用更好的对象字面形式的语法和简洁方法

 var AuthController = {
 errors: [],
 checkAuth() {
 // ...
 },
 server(url,data) {
 // ...
 }
 // ...
 };
 // 现在把 AuthController 关联到 LoginController
 Object.setPrototypeOf( AuthController, LoginController );