Dojo需要（）和AMD（1.7）

Question

我有一個heckuva時間過渡到Dojo和新的AMD結構，我真的希望有人可以對整個概念有所了解。 過去幾周我一直在Google上生活，試圖找到關於不使用的信息，但是使用它的結構和設計模式趨勢。

我發現奇怪的是，對於一個相對復雜的javascript應用程序，例如需要創建和設置Dijits的主頁面，創建的DOM元素等，我需要，因此使用，不同模塊的TON否則在AMD系統之前的dojo命名空間中可用（或者，至少不分配給23個不同的vars）。

例：

require(['dijit/form/ValidationTextBox', 'dijit/form/SimpleTextarea', 'dijit/form/CheckBox', 'dijit/Dialog', 'dijit/form/Form'])
require(['dojo/ready', 'dojo/parser', 'dojo/dom-style', 'dijit/registry', 'dojo/dom', 'dojo/_base/connect', 'dojo/dom-construct'], 
function(ready, parser, style, registry, dom, event, construct){
    //...etc
}

這只是我正在處理的其中一個頁面的一些模塊。 當然，有一種更好的，非byId()的未來發布方式來訪問這些方法，等等。我的意思是，我真的必須導入一個全新的模塊才能使用byId()嗎？ 而另一個連接事件？ 最重要的是，通過必須在函數參數列表中分配變量名來創建的所有混亂只是看起來像這樣的后退。

我想也許你會在require()模塊，比如query模塊，但是如果我不止一次需要它，那么它被賦予的變量很可能超出了范圍，我需要把它放到在domReady! 或ready電話。 reaalllly .... ??！

這就是為什么我只能假設我對道場缺乏了解。

我真的已經查看並搜索並購買了書籍（雖然是AMD之前的一本書），但這個圖書館真的讓我為我的錢買單。 我很欣賞任何人都能看到的光。

編輯示例

require(['dijit/form/ValidationTextBox'])
require(['dojo/ready', 'dojo/parser', 'dojo/dom-style', 'dijit/registry', 'dojo/dom', 'dojo/_base/connect', 'dojo/dom-construct'], function(ready, parser, style, registry, dom, event, construct){
    /* perform some tasks */
    var _name = new dijit.form.ValidationTextBox({
        propercase : true,
        tooltipPosition : ['above', 'after']
    }, 'name')

    /*
    Let's say I want to use the query module in some places, i.e. here.
    */
    require(['dojo/query', 'dojo/dom-attr'], function(query, attr){
        query('#list li').forEach(function(li){
            // do something with these
        })
    })
}

基於這種格式，與dojo工具包人員以及第三方網站的許多示例一起使用，恕我直言，加載所有必需的模塊作為第一個function(ready, parser, style, registy...非常荒謬function(ready, parser, style, registy...會越來越長，並且會在命名沖突等方面產生問題。

在腳本的生命周期中，我需要點擊並require()所有模塊對我來說似乎很愚蠢。 話雖這么說，我不得不看一些“包管理器”腳本。 但是對於這個例子，如果我想在選擇的地方使用查詢模塊，我要么必須在主要的require()語句中加載其余部分。 我理解為什么在一定程度上，但通用點語法命名空間有什么用呢？ dojo.whatever？ dijit.findIt（）？ 為什么加載模塊，以唯一名稱引用，通過閉包，等等等等？

我希望這是一個更容易提出的問題，但我希望這是有道理的。

惱怒

叫我一個新手，但這真的......真的......讓我發瘋。 當談到Javascript（顯然不是）時，我不是菜鳥，但哇。 我無法想象這一點 出來了！

這就是我正在收集的內容。 在adder.js中：

define('adder', function(require, exports){
    exports.addTen = function(x){
        return x + 10
    }
})

在某些母版頁或其他內容中：

require(['./js/cg/adder.js'])

......不遵循整潔的require(['cg/adder'])格式，但無論如何。 現在不重要。

然后， adder的使用應該是：

console.log(adder.addTen(100)) // 110

我得到的最接近的是console.log(adder)返回3 。 是的。 3 。 否則，它的adder is not defined 。

為什么這么難？ 我正在使用我的noob卡，因為我真的不知道為什么這不會聚在一起。

多謝你們。

Answer 1

依賴數組格式：

define(["a", "b", "c"], function (a, b, c) {
});

確實很煩人且容易出錯。 將數組條目與函數參數匹配是一個真正的痛苦。

我更喜歡require格式（ “Simplified CommonJS Wrapper” ）：

define(function (require) {
    var a = require("a");
    var b = require("b");
    var c = require("c");
});

這樣可以縮短線條，並允許您重新排列/刪除/添加線條，而不必記住在兩個地方更改內容。

后一種格式不適用於PS3和舊的Opera移動瀏覽器，但希望你不在乎。

---

至於為什么這樣做而不是手動命名空間對象，@ peller的回答很好地概述了為什么模塊化是一件好事， 我對類似問題的回答談到為什么AMD和模塊系統作為一種實現模塊化的方式是一件好事。

我唯一要補充的是@peller的答案是擴展“關注依賴實際上會產生更好的代碼。” 如果你的模塊需要太多其他模塊，這是一個不好的跡象！ 我們在72K LOC JavaScript代碼庫中有一個松散的規則，模塊應該是~100行長，並且需要0到4個依賴項。 它很好地服務於我們。

Answer 2

requirejs.org非常好地概述了AMD是什么以及為什么要使用它。 是的，Dojo正在向更小的模塊發展，您可以單獨參考這些模塊。 結果是您加載的代碼更少，並且您對它的引用是顯式的。 我認為，關注依賴關系實際上會產生更好的代碼。 AMD支持優化，一旦遷移完成，您就不必再將所有內容加載到全局變量中。 沒有更多的碰撞！ require（）塊包裝使用各種模塊的代碼。 domready中！ 與DOM的加載有關，與范圍內的變量無關。

無論如何，這偏離了SO的Q＆A格式。 您可能想詢問具體問題。