我应该如何考虑我的JavaScript应用程序名称空间

How should I think about my JavaScript application namespaces?

本文关键字:空间 应用程序 JavaScript 何考虑 我的 我应该      更新时间:2023-09-26

我正在构建一个应用程序,它有一个全局命名空间,像这样:

var myApp = {};

然后我有一堆不同的可重用的"模块"组成的模型,视图和控制器。

//Bar chart module code
org.example.chart.bar.module
org.example.chart.bar.model
org.example.chart.bar.view
org.example.chart.bar.controller

我也有一个大的数据源单例和一个数据管理器加载数据到数据源:

org.example.data.dataSource
org.example.data.dataManager //populates the dataSource with CSV data

最后翻译字符串和设置应该在整个应用程序中可用:

org.example.static.translations
org.example.static.settings

您将如何(重新)组织这一点,以便我可以轻松访问应用程序级别的单例(如dataSource, dataManager, translations等),并可以轻松地实例化在当前应用程序实例下的可重用模块?

例如,你会从一开始就为你的"类"和你的应用程序使用相同的命名空间吗?或者你可以这样引用:myApp。翻译= org.example.static.translations?)

不,我们没有命名空间。我们编写模块化代码,并使用模块加载器。

模块加载器的示例将是require.js或browserify或seajs。

一个示例模块是这样的:

(function () {
  var jQuery = require("jQuery");
  var chart = require("chart"); 
  ...
  define("moduleName", moduleObject);
})();

没有什么可以阻止您为类添加另一个名称。例如,

 org.ds = org.example.data.dataSource;

则可以调用

 org.ds.getDatasource();

代替

 org.example.data.dataSource.getDatasource();

但是两个都可以。

EDIT:您还可以创建其他更简单的函数来调用它,将其从oo结构中取出

 var dataSource = function () { return org.example.data.dataSource.getDatasource(); };

考虑使用RequireJS这样的东西来组织模块。

来自Addy Osmani的一些优秀资源:

http://addyosmani.com/largescalejavascript/

http://addyosmani.com/blog/large-scale-jquery/

http://addyosmani.com/resources/essentialjsdesignpatterns/book/