JavaScript 中的原型设计模式

任何JavaScript开发人员都看到了关键字 prototype,被原型继承混淆了,或者在他们的代码中实现了原型。

创建的对象是原始对象的克隆(shallow clones)的传递。原型模式的一个用例是执行一个广泛的数据库操作,以创建用于应用程序的其他部分的对象。

这个UML描述了如何使用原型接口来克隆具体实现。

要克隆一个对象,必须有一个构造器来实例化第一个对象。接下来,使用关键字 prototype的变量和方法将其绑定到对象的结构。

 1var TeslaModelS = function() {
 2    this.numWheels    = 4;
 3    this.manufacturer = 'Tesla';
 4    this.make         = 'Model S';
 5}
 6
 7TeslaModelS.prototype.go = function() {
 8    // Rotate wheels
 9}
10
11TeslaModelS.prototype.stop = function() {
12    // Apply brake pads
13}

构建器允许创建一个单一的TeslaModelS对象. 创建一个新的TeslaModelS对象时,它将保留构建器中初始化的状态。此外,维持功能 go和 stop很容易,因为我们用 prototype声明了它们。

 1var TeslaModelS = function() {
 2    this.numWheels    = 4;
 3    this.manufacturer = 'Tesla';
 4    this.make         = 'Model S';
 5}
 6
 7TeslaModelS.prototype = {
 8    go: function() {
 9    // Rotate wheels
10    },
11    stop: function() {
12    // Apply brake pads
13    }
14}

揭示原型模式

类似于模块模式,原型模式也有显著的变异. 揭示原型模式为公共和私人成员提供封装,因为它返回一个对象的字面。

由于我们正在返回一个对象,我们将对原型对象预先设置一个 ** 函数**. 通过扩展上面的示例,我们可以选择我们想要在当前原型中曝光的内容,以保持其访问水平:

 1var TeslaModelS = function() {
 2    this.numWheels    = 4;
 3    this.manufacturer = 'Tesla';
 4    this.make         = 'Model S';
 5}
 6
 7TeslaModelS.prototype = function() {
 8
 9    var go = function() {
10    // Rotate wheels
11    };
12
13    var stop = function() {
14    // Apply brake pads
15    };
16
17    return {
18    pressBrakePedal: stop,
19    pressGasPedal: go
20    }
21
22}();

注意函数如何停止和去将受到保护,因为它们不在返回对象的范围内。