Подтвердить что ты не робот

Dojo require() и AMD (1.7)

У меня время heckuva переходит на Dojo и новую структуру AMD, и я действительно надеюсь, что кто-то может пролить свет на всю концепцию. В течение последних нескольких недель я живу в Google, пытаясь найти информацию об использовании, но тенденции структуры и дизайна в использовании этого.

Мне кажется странным, что для относительно сложного приложения javascript, например, для главной страницы, где необходимо создать и стилизовать Dijits, создать элементы DOM и т.д., которые мне потребуются, и, следовательно, использовать TON разных модули, которые в противном случае были доступны в пространстве имен Dojo до системы AMD (или, по крайней мере, не были назначены 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()? И еще один для подключения событий? Кроме того, все беспорядок, создаваемый тем, что нужно назначить имя переменной в списке аргументов функций, чтобы цепляться, просто похоже на такой шаг.

Я думал, может быть, вы бы require() модуль только тогда, когда это необходимо, например, модуль query, но если мне это нужно больше одного раза, то вероятность того, что переменная, которую она назначила, выходит за пределы области видимости, d нужно поместить его в вызов domReady! или ready. reaalllly....??!

Вот почему я могу только предположить, что я не понимаю, для dojo.

Я действительно посмотрел и обыскал и купил книги (хотя и до 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 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, так и сторонних сайтов, было бы, IMHO, абсолютно смешно загружать все необходимые модули в качестве первого function(ready, parser, style, registy... будет становиться все длиннее и длиннее и создавать проблемы с коллизиями имен и т.д.

Увольнение и require() всех модулей, которые мне понадобятся во время жизни script, мне просто кажется глупым. При этом мне придется посмотреть на некоторые сценарии "диспетчера пакетов". Но для этого примера, если бы я хотел использовать модуль запроса в выбранных местах, мне пришлось бы либо загрузить его с остальным в основной оператор require(). Я понимаю, почему в какой-то степени, но что плохого в родовых точечно-синтаксических пространствах имен? dojo.whatever? dijit.findIt()? Зачем загружать модуль, ссылку в уникальное имя, проходить через закрытие, бла-бла?

Я бы хотел, чтобы это был более простой вопрос, но я надеюсь, что это имеет смысл.

Раздражение

Назовите меня новичком, но это действительно.. на самом деле.. вождение меня с ума. Я не noob, когда дело доходит до 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, потому что я действительно не понимаю, почему это не происходит вместе.

Спасибо, ребята.

4b9b3361

Ответ 1

Формат массива зависимостей:

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

действительно может быть раздражающим и подверженным ошибкам. Согласование записей массива с параметрами функции - настоящая боль.

Я предпочитаю формат require (Упрощенный обертка CommonJS):

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

Это сокращает ваши строки и позволяет вам переупорядочивать/удалять/добавлять строки, не забывая менять вещи в двух местах.

Последний формат не будет работать на PS3 и более старых браузерах Opera, но, надеюсь, вам все равно.


Что касается того, почему для этого вместо ручного размещения имен объектов, ответ @peller дает хороший обзор того, почему модульность - это хорошо, и мой ответ на аналогичный вопрос говорит о том, почему AMD и модульные системы как способ достижения модульности - это хорошо.

Единственное, что я хотел бы добавить к ответу @peller, - это расширить "внимание к зависимостям, которое действительно делает для гораздо лучшего кода". Если ваш модуль требует слишком много других модулей, это плохой знак! У нас есть свободное правило в нашей кодовой базе кода LOC 72K, что модуль должен быть длиной ~ 100 строк и требует от нуля до четырех зависимостей. Это служило нам хорошо.

Ответ 2

requirejs.org дает довольно хороший обзор того, что такое AMD и почему вы хотите его использовать. Да, Dojo перемещается в сторону меньших модулей, которые вы будете ссылаться индивидуально. В результате вы загружаете меньше кода, и ваши ссылки на него явны. Думаю, что обращать внимание на зависимости действительно делает намного лучший код. AMD обеспечивает оптимизацию, и как только миграция завершена, вам больше не нужно загружать все в глобальные. Больше никаких столкновений! Блок require() обертывает код, который использует различные модули. domReady! относится к загрузке DOM и не имеет никакого отношения к переменным, находящимся в области видимости.

В любом случае, это отклоняется от формата Q & A SO. Вы можете задать конкретные вопросы.