RequireJs學習筆記之Define a Module

c3tc3tc3t發表於2013-11-04


簡單的鍵值對定義
define({
    color: "black",
    size: "unisize"
});

如果一個模組沒有任何依賴,又需要做用一個函式做一些事情,直接定義一個函式然後傳給define()
//my/shirt.js 返回定義的模組是一個鍵值對

define(function () {
    //Do setup work here

    return {
        color: "black",
        size: "unisize"
    }
});

使用需要依賴的函式來定義模組
如果一個模組有依賴,第一個引數應該是一組這個模組依賴的函式名 ,第二次引數就是你定義的函式,在依賴載入完,這個函式被定義成模組一次,函式應該返回一個物件,這個物件就是定義的模組,依賴將會作為引數傳遞給定義的函式,引數傳遞的順序和陣列裡定義依賴的模組順序一樣

//my/shirt.js 依賴的模組是 a cart 和 inventory

define(["./cart", "./inventory"], function(cart, inventory) {
       
        //返回了一個模組,這個模組是一個物件 名字是my/shirt或者叫shirt
        return {
            color: "blue",
            size: "large",
            addToCart: function() {
                inventory.decrement(this);
                cart.add(this);
            }
        }
    }
);
上面例子 my/shirt模組被建立,依賴my/cart和myinventory模組 ,硬碟上的目錄結構

    my/cart.js
    my/inventory.js
    my/shirt.js
    
上面的函式定義了兩個引數叫   "cart" and "inventory".  兩個引數代表 my/cart和my/inventory模組,當my/cart和my/inventory模組載入完,my/shirt模組才被建立,這個函式收到"cart" and "inventory"作為引數傳進來
    
不建議定義全域性模組,一個模組可能在一個頁面一個時間點裡存在多個版本所以函式引數順序應該匹配模組依賴順序
    
    
返回一個函式作為模組
定義一個模組 foo/title.js 依賴於my/cart and my/inventory
define(["my/cart", "my/inventory"],
    function(cart, inventory) {
        //return a function to define "foo/title".
        //It gets or sets the window title.
        return function(title) {
            return title ? (window.title = title) :
                   inventory.storeName + ' ' + cart.name;
        }
    }
);
    
    
    
給定義模組取一個名字,"foo/title"就是名字,但最好有引擎自己做。不要自己取
 //Explicitly defines the "foo/title" module:
    define("foo/title",
        ["my/cart", "my/inventory"],
        function(cart, inventory) {
            //Define foo/title object in here.
       }
    );
    
jsnop
    require(["http://example.com/api/data.json?callback=define"],
    function (data) {
        //The data object will be the API response for the
        //JSONP data call.
        console.log(data);
    }
);
    

















相關文章