Object.create方法及其在继承上的应用

方法介绍

Object.create 方法是JavaScript中用于创建对象的一个方法。
Object.create接收两个参数，第一个表示要继承的对象，第二个参数表示也是一个对象，用于对新创建的对象进行初始化。下面我们来看具体应用：

var Obj ={
 name:'mini',
 age:3,
 show:function () {
     console.log(this.name +" is " +this.age);
 }
}

上面的Obj对象是一个原始对象，用于被继承。

var MyObj = Object.create(Obj,{
like:{
 value:"fish",   // 初始化赋值
 writable:true,   // 是否是可改写的
 configurable:true, // 是否能够删除，是否能够被修改
 enumerable:true    //是否可以用for in 进行枚举
},
hate:{
configurable:true,
get:function () { console.log(111);  return "mouse" },  // 获取对象hate属性时触发的方法
set:function (value) {  // 设置对象hate属性时触发的方法 
    console.log(value,2222);
    return value;
}    
}
});

注意：Object.create方法第二个参数的属性也是对象，对象中的所有属性都是固定，不是自定义的。具体每个属性代表什么意思，我们在上边代码的注释中已有所标记。我们可以通过以下代码加深对这个方法的理解：

console.log(MyObj.name);  // mini
console.log(MyObj.like);  // fish
MyObj.like = "peanut";    // 属性修改赋值
console.log(MyObj.like);  // peanut
MyObj.hate;  // 111    触发get方法
MyObj.hate = 'dog'; // dog,2222   触发set方法

相信通过上边的执行结果你已经能大概理解了Object.create方法的使用方法。而且你可能也注意到了，这里get和set 方法似乎还蕴含更大的潜力。我们可以利用它们去实现数据的过滤和数据的绑定。实现一些简单的mvvm的效果。但这不是我们讨论的重点。

在继承上的应用

在讲解Object.create方法在构造函数上的应用之前我们先来回顾构造函数的继承

var Animal=function () {}
Animal.prototype.show=function () {
    console.log("animal");
}
var  Dog = function () { }
var subClass = function () {}
subClass.prototype = Animal.prototype;
Dog.prototype = new subClass(); // 继承Animal

以上代码是我们实现继承最常用的一种方式，这种方式是借助于一个代理函数，通过继承构造函数的实例来继承构造函数上的属性。

在了解了Object.create方法之后，或许你可以通过另一种方式实现继承：

var A = function () { };
A.prototype.sayName=function () {
    console.log('a');
}

// B的实例继承了A的属性
var B = function () { };
B.prototype = Object.create(A.prototype);
var b = new B();
b.sayName();  // a

通过检测，我们发现通过继承原型对象然后赋值给自己的原型对象的这种方式也可以实现继承。但这种方式是不是我们想要的完美继承呢？

// 重新改写B的prototype
B.prototype= {
    sayName:function () {
        console.log("b");
    }
}

//  改写后,B的实例属性发生了变化
var b1 = new B();
b1.sayName();  //b

//  A的实例维持原来的属性，没有被改写。达到了我们想要的继承效果
var a1 = new A();
a1.sayName(); //a

通过上边的案例，我们可以发现，Object.create这种方式实现了将A,B的原型完美分隔。双方不会互相影响，也就是说这是确实可行的继承实现方式。

不过，像Object.create这种黑科技方法一般都会存在兼容性问题。所以我们还需要处理一下兼容问题，才能放心使用。

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

通过上边这个补丁代码，似乎又回到了我们之前处理继承的方式，如此一来，我们便可以在所有浏览器中通过B.prototype =Object.create(A.prototype)的方式来实现继承了。