跨应用程序共享JS文件

Question

我们正在开发一个移动应用程序，并且试图找出在整个应用程序中共享javascript函数的最佳方法。

目前，我们有一些单独的文件，它们仅具有：

var LIB = {
    URL: "http://localhost/service",
    connect: function() {
       // connect to server
      $.ajax({ url: this.URL }); // etc etc

      // call a private function?
      this._somethingElse();
    },
    _somethingElse: function() {
      // do something else
    }
};

然后我们简单地称呼诸如：

LIB.connect(); 或LIB.disconnect();

跨任何文件。

这也使我们能够访问LIB.URL 。

我的问题是这种方法是否最好？

我已经看到人们也使用以下方法，但是有什么好处呢？

var LIB = function () {
    this.URL = "http://localhost/service";
    this.connect = function () {
      var myself = this;
      // connect to server
      $.ajax({ url: this.URL }); // etc etc

      // call a private function?
      myself._somethingElse(); // best way to invoke a private function?
    };
    this._somethingElse = function () {
      // do something else
    };
};

这需要以下条件：

var lib = new LIB();

lib.connect();

编辑：

我还看到了以下内容：

window.lib = (function () {
    function Library () {
    }

    var lib = {
        connect: function () {
          // connect to server
        }   
    };

    return lib;
}());

我对所有这些选项感到有些困惑。

Answer 1

这取决于您更喜欢哪个。 我（从个人角度而言）更喜欢前者，但每个人都更喜欢他。 后者的确有一个缺点，即需要要么在使用前记住声明new变量，要么必须跟踪已经创建的变量。

此外，在技术层面上，第一个程序应该会获得轻微的性能（几乎没有引起注意），因为您不必计算新函数。

编辑是的，第一种方法绝对是最快的方法 。

Answer 2

我强烈建议您使用模块系统。 在ES6出现之前（ http://wiki.ecmascript.org/doku.php?id=harmony:modules ），您必须使用第3方库才能执行此操作。

• 每个对象/类/实用程序/等都是一个模块。

• 模块导出公共api，而使用模块通过声明其依赖关系导入其他模块。

• 存在两个“标准”：AMD和CommonJS。 在浏览器中，使用AMD标准的RequireJS之类的库非常受欢迎。 我建议先检查他们的网站： http : //requirejs.org/并查看他们的示例。

这里的主要优点是您只公开了公共api，它允许您创建功能的沙箱。 它也更加明确，因为很容易看到模块所依赖的内容，而不是依赖于全局对象。

Answer 3

有几种不同的方法来构造JavaScript代码以实现可重用性。 您可以研究这些，然后决定哪一个是最佳的。 我个人而言，我使用了您概述的第二种方法。 但是，我将代码分成几个部分，并实际上遵循MVVM结构。 例如，我有一个名为模型和视图模型的名称空间。 我的每个js文件都以：

window.[APP NAME].Models.[CLASS/MODULE NAME] or window.[APP NAME].Models.[CLASS/MODULE NAME]

因此，假设我有一个名为mynamespace的命名空间，并且有一个名为myclass的模块/类。 我的js文件开头为：

window.MYNAMESPACE = window.MYNAMESPACE || {};
window.MYNAMESPACE.ViewModels = window.MYNAMESPACE.ViewModels || {};

window.MYNAMESPACE.ViewModels.MyClass = function () {
    // a public function
    this.func1 = function () {
    };

    // a private function
    function func2() {
    }
};

然后，我将通过调用来消耗该类：

var myClassModel = new window.MYNAMESPACE.ViewModels.MyClass();
myClassModel.func1();

这使您可以很好地封装代码。 您可以研究/搜索的其他一些模式是：原型模式，模块模式，显示模块模式和显示原型模式。

希望对您有所帮助，但是如果您对我刚才所说的内容有任何疑问，请随时评论此帖子。