聊聊Object.create()

##Object.create()
这是JavaScript ES5中定义的方法。使用指定的原型对象和其属性,创建了一个新的对象。
完整的表达是
Object.create(proto, [ propertiesObject ])
proto就是对象的原型,propertiesObject可选参数是一组属性与值,该对象的属性名称将是新创建的对象的属性名称,值是属性描述符。

该方法的使用比较局限,先看这个例子

var Share = {
    message: "新消息",
    sendTo: function(channel){
        alert(this.message + "分享至:" + channel);
    }
};
var shareWx = Object.create(Share);
shareWx.sendTo("微信");
// alert输出内容:新消息分享至:微信

以上例子实现了一个Share类,并定义了它属性和方法。create创建的shareWx,是根据Share为原型创建的新对象。这种方法与常用的new一个对象类似,但很显然,用Object实现类的定义,不能直接定义出私有属性和方法(当然可以做些调整即可实现)。

还是说说create()其他作用。
可以使用Object.create()来实现类继承。

//基类
function Shape() {
  this.x = 0;
  this.y = 0;
}

//定义move方法
Shape.prototype.move = function(x, y) {
    this.x += x;
    this.y += y;
    console.log("形状移动了");
};

// 创建一个矩形类,继承基类
function Rectangle() {
  Shape.call(this); //super constructor.
}

// 矩形类原型链赋值可以获取基类原型链上的方法
Rectangle.prototype = Object.create(Shape.prototype);

var rect = new Rectangle();

rect instanceof Rectangle //true
rect instanceof Shape //true

rect.move(1, 1); //输出, "形状移动了"

看到这,似乎有些不解了,Object.create与new到底有什么区别呢?

var Base = function(){}
var leaf = new Base();
console.log(leaf.__proto__ == Base.prototype);
// 输出:true


var Base = {a:1}
var leaf = Object.create(Base);
console.log(leaf.__proto__);
// 输出:{a:1}


var Base = function(){
    this.a = 1;
};
var base = new Base();
var leaf = Object.create(Base.prototype);
console.log(leaf.__proto__== Base.prototype);
// 输出:true

这么看就非常明白了,new 出来的对象,其proto属性指向该类的prototype。
Object.create()出来的对象,直接指向对象本身。

关于更深入探索,放个引子,推荐一篇文章链接,这将会越来越有趣。

发表评论

电子邮件地址不会被公开。 必填项已用*标注