使用 JavaScript 揭示原型模式，我如何命名原型中包含的函数？答案

【问题标题】：Using the JavaScript revealing prototype pattern, how can I namespace functions contained within prototypes?使用 JavaScript 揭示原型模式，我如何命名原型中包含的函数？
【发布时间】：2012-12-29 00:49:10
【问题描述】：

我正在使用 Revealing Prototype Pattern 并且有 2 个不同的原型，我将它们放入同一个 JavaScript 文件中。这些链接指向我发现的与此相关的文章。 http://bit.ly/U83hdg, http://bit.ly/VmJ71h.

我的印象是它们会像原子类一样运行，其中与一个相关的函数将不知道另一个函数。

例如，这两个原型都有一个“init”和一个“set”函数。我在浏览器中看到的行为是“init”的最后一个版本被执行，即使代码引用了第一个原型名称。

这是我的两个原型的通用精简代码。

var operationA = function (control, settings) {
   this.control = control;
   this.settings = settings;
};

operationA.prototype = function () {
   init = function () {
      // do something
      return this;
   }
   set = function () {
      // do something
      return this;
   };

   return {
      init: init,
      set: set
   };
}

var operationB = function (control, settings) {
   this.control = control;
   this.settings = settings;
};

operationB.prototype = function () {
   init = function () {
      // do something
      return this;
   }
   set = function () {
      // do something
      return this;
   };

   return {
      init: init,
      set: set
   };
}

这就是我实例化第一个对象的方式。

var objectASettings = {
   property1: 48,
   property2: 37
};
var objectA = new operationA('#mySelector', objectASettings);
objectA.init().set();

当上述运行时，正在执行 operationB 原型中的 init 和 set 函数，而不是执行 operationA 原型中的 init 和 set 函数。

我假设这些原型基本上命名了它们包含的函数。我是否需要为 operationA 和 operationB 创建唯一的公共函数名称（如 initA、setA、initB、setB）？

有没有办法让这些公共函数自包含和/或命名空间，这样我就可以公开相同的 init 操作名称并在同一个文件中设置 2 个不同的原型？

感谢您的帮助。

【问题讨论】：

标签： javascript jquery design-patterns namespaces prototype

【解决方案1】：

几件事情让它工作：

在原型函数的第一个成员之前添加 var。
用逗号分隔每个成员（您当然可以将 var 放在每个成员的前面，但我喜欢保持干净...不过个人喜好）。
分配给原型的函数必须自调用才能使模式正常工作。

这是一个适合您的示例：

<html>
<head>
   <script>
        var operationA = function (control, settings) {
           this.control = control;
           this.settings = settings;
        };

        operationA.prototype = function () {
           var init = function () {
              // do something
              return this;
           },
           set = function () {
              alert('set A');
              return this;
           };

           return {
              init: init,
              set: set
           };
        }();

        var operationB = function (control, settings) {
           this.control = control;
           this.settings = settings;
        };

        operationB.prototype = function () {
           var init = function () {
              // do something
              return this;
           }, 
           set = function () {
              alert('set B');
              return this;
           };

           return {
              init: init,
              set: set
           };
        }();

        window.onload = function() {
            var objectASettings = {
               property1: 48,
               property2: 37
            };
            var objectBSettings = {
               property1: 50,
               property2: 50
            };
            var objectA = new operationA('#mySelector', objectASettings);
            objectA.init().set();

            var objectB = new operationB('#foo', objectBSettings)
            objectB.init().set();
        }
   </script>
</head>

【讨论】：

【解决方案2】：

在定义 init 和 set 时省略了 var 关键字，因此它们都分配给了全局对象。

【讨论】：

【解决方案3】：

只需将原型定义为对象。

var operationA = function (control, settings) {
   this.control = control;
   this.settings = settings;
};

operationA.prototype = {
   init: function () {
      // do something
      return this;
   },
   set: function () {
      // do something
      return this;
   }
}

var operationB = function (control, settings) {
   this.control = control;
   this.settings = settings;
};

operationB.prototype = {
   init: function () {
      // do something
      return this;
   },
   set: function () {
      // do something
      return this;
   }
};

【讨论】：

它们是对象。他可能只是想使用闭包来设置私有数据成员。