编程语言
首页 > 编程语言> > Javascript模块模式可以用于单例,也可以用于实例化多个时间的对象吗?

Javascript模块模式可以用于单例,也可以用于实例化多个时间的对象吗?

作者:互联网

我有两种形式的表格.顶部有一种类型A的单一形式,然后在其下面有一种或多种类型B的形式.

我使用模块模式jQuery连接表单上的所有事件,处理验证,ajax调用等.

这是在表单A中定义单例并在表单B中定义可重用对象类的首选/有效方法吗?它们非常相似,我不确定是否需要使用对象的prototype属性,new或其他模式.一切似乎都对我有用,但恐怕我错过了一些关键错误.

形式javascript看起来像这样:

var MyProject.FormA = (function() {
  var $_userEntry;
  var $_domElementId;

  var validate = function() { 
    if($_userEntry == 0) {
      alert('Cannot enter 0!');
    } 
  }
  var processUserInput = function() {
    $_userEntry = jQuery('inputfield', $_domElementId).val();
    validate();
  }
  return {
    initialize: function(domElementId) {
      $_domElementId = domElementId;
      jQuery($_domElementId).click(function() {
        processUserInput();
      }
    }
  }

})();
jQuery(document).ready(function() {
  MyProject.FormA.initialize('#form-a');
});

一次或多次初始化的表格B的定义如下:

var MyProject.FormB = function() {
  var $_userEntry;
  var $_domElement;

  var validate = function() { 
    if($_userEntry == 0) {
      alert('Cannot enter 0!');
    } 
  }
  var processUserInput = function() {
    $_userEntry = jQuery('inputfield', $_domElement).val();
    validate();
  }
  return {
    initialize: function(domElement) {
      $_domElement = domElement;
      jQuery($_domElement).click(function() {
        processUserInput();
      }
    }
  }

};
jQuery(document).ready(function() {
  jQuery(".form-b").each(function() {
    MyProject.FormB().initialize(this);
  });
});

解决方法:

您的两个模块都显式返回对象,从而无法使用new.

原型继承与通过这种模式隐藏实现的方法并不真正兼容.当然,您可以使用在其上定义了validate方法的原型表单对象来重写此方法,但是此方法将是可见的,并且您会松开封装.

是否需要低内存占用和原型的对象快速初始化(共享方法仅存在一次,实例化以恒定的时间运行)或对模块模式的封装带来轻微的性能损失(由多个定义的相同方法,对象实例化速度变慢,因为每次都必须创建每种方法)

在这种情况下,我建议性能差异不大,因此请选择您喜欢的任何东西.就我个人而言,我会说它们之间有太多重复,我倾向于统一它们.您真的需要A才能成为单身人士吗?意外实例化两次有什么危险?似乎这可能是针对此问题的过度设计.如果您真的必须有一个单身人士,我可以将非单身(B)类包装成这样:

var getSingleton = function() {
    var form = MyProject.FormB();
    form.initialize("#form-a");
    console.log("This is the original function");
    getSingleton = function() {     
        console.log("this is the replacement function");
        return form;
    }
    return form;
}

标签:oop,singleton,module-pattern,javascript,jquery
来源: https://codeday.me/bug/20191209/2097689.html