Cocos Creator 中的 JavaScript 使用和 Node.js 幾乎相同的 CommonJS 標準來實現模塊化,

簡單來説:

  • cocos 中 cc.Class 定義的每一個單獨的 JavaScript 腳本文件就構成一個模塊。
  • cocos 中普通 JavaScript 腳本文件需要添加 module.exports 主動導出成模塊。

模塊化的特性:

  • 每個模塊都是一個單獨的作用域,互不干擾。
  • 當前模塊如果想使用其它模塊代碼需要以 require 方法來引用。

如下是針對2種不同情況下,模塊化的示例代碼:

1. cocos 中 cc.Class 定義 JavaScript 模板文件

例如 test.js,格式如下:

// test.js
cc.Class({
    extends: cc.Component,
     properties: {
         speed: 10,
     },
     update: function () {}
 });

現在要在別的腳本里訪問它,可以在別的腳本里: 

//先require引用該js模塊,然後使用其定義的屬性和方法。
var test = require("test");
cc.log("speed is", test.speed);

這樣便能正確輸出:"speed is 10"。

注意:

  • require 可以在腳本的任何地方任意時刻進行調用。
  • 遊戲開始時會自動 require 所有腳本,這時每個模塊內部定義的代碼就會被執行一次,之後無論又被require幾次,返回的始終是同一份實例。

2. 普通 JavaScript 代碼的模塊化處理。

例如 test.js,格式如下:

// test.js
var test = {
    speed: 10,
    load: function () {
        // ...
    }
};
module.exports = test

現在要在別的腳本里訪問它,可以在別的腳本里:

//先require引用該js模塊,然後使用其定義的屬性和方法。
var test = require("test");
cc.log("speed is", test.speed);

這樣便能正確輸出:"speed is 10"。

注意:

  • 當你的 module.exports 沒有任何定義時,如果腳本里有定義了 cc.Class,則自動把 exports 設為定義的 cc.Class,否則按照 module.exports 導出的對象為準。
  • 每個腳本都是一個單獨的作用域,在腳本內使用 var 定義的局部變量,將無法被模塊外部訪問。但可以導出整個模塊,也可以導出單個對象或方法。只有導出後,才可以使用其導出的對象或方法。