commonjs

jiang_xin_yu發表於2024-04-17

什麼是CommonJS

JavaScript是一種強大的面嚮物件語言，它有很多快速高效的直譯器。官方JavaScript標準定義的API是為了構建基於瀏覽器的應用程式。然而，並沒有定義一個用於更廣泛的應用程式的標準庫。CommonJS API定義了很多普通應用程式（主要指非瀏覽器的應用）使用的API，從而填補了這個空白。它的終極目標是提供一個類似Python，Ruby和Java的標準庫。這樣的話，開發者可以使用CommonJS API編寫應用程式，然後這些應用可以執行在不同的JavaScript直譯器和不同的主機環境中。在相容 CommonJS 的系統中，你可以使用JavaScript開發伺服器端JavaScript應用程式、命令列工具、圖形介面應用程式和Hybrid混合應用程式。

CommonJS與NodeJS的關係

CommonJS是一種規範，NodeJS是這種規範的實現。
以下的例子很好的說明了它們之間的關係：

CommonJS Modules

CommonJS Modules是有關如何實現模組化的定義，使得API可以通過模組化的系統協同工作。

在一個module中，有一個全域性function變數“require”，require函式接受一個module identifier引數，然後返回一個外部module匯出的API。外部module準備好一個exports物件，require函式返回這個exports物件，可以向exports物件中新增API。如果請求的module無法返回時，require函式將丟擲error。

如果出現依賴閉環(dependency cycle)，那麼外部模組在被它的傳遞依賴（transitive dependencies）所require的時候可能並沒有執行完成；在這種情況下，"require"返回的物件必須至少包含此外部模組在呼叫require函式（會進入當前模組執行環境）之前就已經準備完畢的輸出

如上所述，在一個module中，也有一個物件變數“exports”。module新增API到該物件中。
module必須使用exports的形式匯出API。
module identifier必須是符合小駝峰命名的字串，或以“.”、“..”開頭的相對路徑或絕對路徑，可以沒有檔名字尾.js。

Sample Code

math.js

exports.add = function() { 
    var sum = 0, i = 0, args = arguments, l = args.length; 
    while (i < l) { 
        sum += args[i++]; 
    } 
    return sum;
};

increment.js

var add = require('math').add;
exports.increment = function(val) { 
    return add(val, 1);
};

program.js

var inc = require('increment').increment;
var a = 1;
inc(a); // 2

NodeJS中的modu.exports和exports

每一個node.js執行檔案，都自動建立一個module物件，同時，module物件會建立一個叫exports的屬性，初始化的值是 {}。而exports是引用 module.exports的值。module.exports 被改變的時候，exports不會被改變，當模組匯出的時候，真正匯出的執行是module.exports，而不是exports

React Native

在React Native中，所有模組元件檔案可以遵循CommonJS的規範，如果js檔案是通過應用本地bundle載入肯定沒有問題，而如果是通過伺服器獲取js檔案，應該是相關檔案會一次性打包壓縮傳輸到本地。

載入模組：

var React = require('react-native');
var SearchPage = require('./SearchPage');

匯出模組：

module.exports = SearchPage;