JavaScript原型模式实现：Object.create与prototype对比

概述

原型模式的核心在于利用一个原型实例来确定所创建对象的类型，并通过复制该原型来生成新的对象。这是一种专门用于创建对象的设计模式，其本质是创建一个对象，并将其作为另一个对象的prototype属性。

注意：在深入学习和应用原型模式之前，务必先掌握原型、原型链、prototype属性、__proto__属性以及constructor等基础知识。

实现原型模式

ES5提供的API：Object.create(prototype, optionalDescriptorObjects)

Object.create()方法接受两个参数：第一个参数指定新对象的原型（即__proto__指向的对象）；第二个参数是可选的描述符对象，用于初始化额外的属性，其格式为字面量对象。

var vehiclePrototype = {
    model:"保时捷",
    getModel: function () {
        console.log('车辆模具是：' + this.model);
    }
};

var vehicle = Object.create(vehiclePrototype,{
    "model":{
        value:"法拉利"
    }
});

vehicle.getModel();  //车辆模具是：法拉利

使用Object.create实际上创建了一个名为vehiclePrototype的新对象，并使新对象继承了该原型上的方法。此时，新对象的__proto__属性指向vehiclePrototype。

在第二个参数中初始化了model属性，将其值设为“法拉利”。因此，新创建的对象vehiclePrototype中仅包含一个model属性，其值为“法拉利”。

若不使用Object.create()，可以通过直接操作prototype来实现：

var vehiclePrototype = {
    init: function (carModel) {
        this.model = carModel || "保时捷";
    },
    getModel: function () {
        console.log('车辆模具是：' + this.model);
    }

};

function vehicle(model) {
    function F() { };
    F.prototype = vehiclePrototype;    
    var f = new F();
    f.init(model);
    return f;
}
var car = vehicle('法拉利');
car.getModel();  // 车辆模具是：法拉利

上述代码的核心在于vehicle对象。我们首先创建一个新的构造函数，将该函数的原型指向vehiclePrototype，然后实例化该函数。最后，继承并调用prototype上的init方法，返回执行结果，同样可以实现原型模式的效果。

总结

原型模式在JavaScript中无处不在，许多其他设计模式也是基于prototype实现的。因此，深入学习和复习原型及原型链知识至关重要，重点在于掌握prototype、__proto__和constructor等关键属性。

以上就是关于JavaScript实现原型模式的详细内容，更多相关技术资料请查阅本站其他文章。