CommonJS模塊模式

Question

我從

助焊劑架構

var AppDispatcher = require('../dispatcher/AppDispatcher');
var EventEmitter = require('events').EventEmitter;
var TodoConstants = require('../constants/TodoConstants');
var assign = require('object-assign');

var CHANGE_EVENT = 'change';

var _todos = {}; // collection of todo items

/**
 * Create a TODO item.
 * @param {string} text The content of the TODO
 */
function create(text) {
  // Using the current timestamp in place of a real id.
  var id = Date.now();
  _todos[id] = {
    id: id,
    complete: false,
    text: text
  };
}

/**
 * Delete a TODO item.
 * @param {string} id
 */
function destroy(id) {
  delete _todos[id];
}

var TodoStore = assign({}, EventEmitter.prototype, {

  /**
   * Get the entire collection of TODOs.
   * @return {object}
   */
  getAll: function() {
    return _todos;
  },

  emitChange: function() {
    this.emit(CHANGE_EVENT);
  },

  /**
   * @param {function} callback
   */
  addChangeListener: function(callback) {
    this.on(CHANGE_EVENT, callback);
  },

  /**
   * @param {function} callback
   */
  removeChangeListener: function(callback) {
    this.removeListener(CHANGE_EVENT, callback);
  },

  dispatcherIndex: AppDispatcher.register(function(payload) {
    var action = payload.action;
    var text;

    switch(action.actionType) {
      case TodoConstants.TODO_CREATE:
        text = action.text.trim();
        if (text !== '') {
          create(text);
          TodoStore.emitChange();
        }
        break;

      case TodoConstants.TODO_DESTROY:
        destroy(action.id);
        TodoStore.emitChange();
        break;

      // add more cases for other actionTypes, like TODO_UPDATE, etc.
    }

    return true; // No errors. Needed by promise in Dispatcher.
  })

});

它在哪里說

上面的代碼中有幾件事要注意。 首先，我們將維護一個稱為_todos的私有數據結構。 該對象包含所有單獨的待辦事項。 因為此變量位於類之外，但在模塊的關閉之內，所以它保持私有狀態 -不能從模塊外部直接更改。 通過不進行任何操作就無法更新存儲，這有助於我們為數據流保留獨特的輸入/輸出接口。

大膽的部分對我來說還不清楚。 js解釋器如何知道所有這些代碼都在模塊閉包內部而不在全局范圍內？ 模塊關閉的起點和終點？

我所知道的

用var聲明的變量的范圍是其當前的執行上下文，它是封閉的函數，或者對於在任何函數之外聲明的變量，都是global 。

有什么解釋嗎？

Answer 1

您實際上錯過了引述的摘錄的最后一行：

module.exports = TodoStore;

CommonJS是一個API，用於定義使用以下約定的模塊：

• 每個文件都定義一個模塊並在隔離的環境中執行; 就是說它定義的變量不能在模塊外部使用 。
• 為了允許導入其他模塊，模塊可以使用全局變量require ，從而允許其導入其他模塊
• 同樣，變量module可用於該模塊，以便它可以設置其exports屬性來定義模塊應導出的內容； 您在模塊a.js中為module.exports設置的值正是require('./a')將返回的值。

每個實現CommonJS的JS環境都必須知道這些規則 。 當然，其中包括Node.js，還包括諸如Browserify和Webpack之類的捆綁程序，它們將打包您的代碼，以便遵守這些約定。

這樣，您可以控制將導出模塊的哪一部分。

PS：請注意，您還可以使用exports var來定義您的導出，並且它的用法與module.exports略有不同。 有關詳細信息，請參見此StackOverflow問題和答案 。

Answer 2

通用JS模式使用構造函數定義您的實用程序。

它以類的形式定義。

var moduleName = function() {

  // private variables

  // public functions
  this.method1 = function() {
    // logic1 goes here
  };

  this.method2 = function() {
    // logic2 goes here
  };

};

因此，我們將使用以下命令將類導出到其他模塊

    module.exports = moduleName;

這樣其他模塊就可以導入，實例化它，然后使用該功能。

如何使用它？

    var module = require('moduleName');  //importing the module created above

在這里，模塊定義被獲取，執行，然后在'module'變量中可用。

這個變量名可以是任何東西

    var objectOfModule = new module(); //instance is created

    objectOfModule .method1(); //use1

    console.log(objectOfModule .method2()); //use2

謝謝。