2012-08-16 61 views
39
傳遞

我使用Requirejs在我們的Web應用程序中加載JavaScript。問題是,我得到一個undefined對象被傳遞給一個模塊,當在其他模塊中使用時,它被很好地實例化。未定義的對象通過Requirejs

好的,這是設置。我main.js文件,該文件requirejs在啓動時運行:

require.config({ 
    baseUrl: "/scripts", 
    paths: { 
     demographics: "Demographics/demographics", 
     complaints: "Complaints/complaints", 
    } 
}); 

require(["templates", "demographics", "complaints", "crossDomain"], function (templates, demographics, complaints) { 
    "use strict"; 

    console.log("0"); 
    console.log(demographics === undefined); 

    demographics.View.display(); 
}); 

很多的配置已經被剝奪,只是在這個問題上的核心文件。

這裏的Demographics.js

define(["ko", "templates", "complaints", "globals", "underscore"], function (ko, templates, complaints, globals) { 

    // Stuff removed. 
    return { 
     View: view 
    }; 
}); 

Complaints.js

define([ 
    "demographics", 
    "ko", 
    "templates", 
    "complaints", 
    "visualeffects", 
    "globals", 
    "webservice", 
    "underscore", 
    "typewatcher", 
    "imagesloaded"], 
    function (demographics, ko, templates, complaints, visualeffects, globals, webservice) { 
     "use strict"; 


     console.log("1"); 
     console.log(demographics === undefined); 
    return { 
     View: view 
    }; 
}); 

問題是這樣的 - 在Complaints.js通過define配置通過demographics參數爲undefined。控制檯註銷告訴我「人口統計數字===未定義」是true

但是,當main.js文件執行時,傳遞給它的人口統計參數不是未定義的,而是如預期的那樣是一個實例化對象。

現在我被卡住了,因爲我看不到爲什麼在complaints.js人口統計變量未定義。任何人都可以發現我錯過的東西嗎?

回答

56

你有循環依賴。 demographics模塊取決於complaintscomplaints取決於demographics。由於每documentation

如果你定義一個循環依賴(一個需要B和B需要一個),然後當b的模塊函數被調用這種情況下,它會得到一個未定義的值。

解決方案如果無法刪除循環依賴項,則需要在其他按需內異步請求其中一個模塊(例如,當視圖實例化時,而不是定義視圖的模塊是執行)。 docs再一次覆蓋了這個話題。

+0

啊,正是我所懷疑的,但真的沒有想到會發生這種情況(我是一個真正的新手,這AMD/requirejs的東西:)我的行動計劃是創建另一個模塊,將託管兩個代碼人口統計和抱怨。這意味着這個新模塊將用於調用其他兩個文件的代碼。感謝您確認我的想法。當我得到時間時會試一試。 – 2012-08-16 19:46:46

26

另一種情況是當您定義模塊時意外鍵入require而不是define,我花了一些時間注意到這一點。

11

我有類似的問題。就我而言,定義模塊的時候,我會寫:的

define('some_dependency', ... 

代替

define(['some_dependency'], ... 
4

另一個可能的原因是執行模塊的接口(AMD,CommonJS的),但忘記任何回報。我剛剛做到了。

0

另一個可能的原因可能在事後看來很明顯是模塊代碼中的錯誤。就我而言,我試圖從一個未定義的變量中獲取一個屬性。該錯誤記錄在控制檯中,但出於某種原因,我沒有看到它/將其誤認爲未定義的模塊錯誤。

-1

我只是遇到的另一個原因是:

define(function() { 
    return {}; 
}()); // <-- notice the '()' typo. 

這個「筆誤」導致沒有JS錯誤,這一個,並可以把它混淆找出特別是在與許多潛在的循環依賴關係複雜的應用程序。

當然,原因是「拼寫錯誤」是有效的JS,它簡單地調用您定義的函數,從而將其結果傳遞給define(),而不是按預期方式傳遞函數。