Может ли кто-нибудь объяснить синтаксис, связанный с этим примером require.js?

Я надеюсь, что этот вопрос не слишком широк, но в этом конкретном примере require.js/ESRI присутствует много незнакомого синтаксиса, и я надеюсь, что кто-то может объяснить мне некоторые из этого.

Во-первых, этот код работает (то есть, он делает то, что я ожидаю от него): он создает базовую карту и добавляет FeatureLayer, извлеченный из службы карт. Это урезанная версия примера из страницы API Javascript ESRI. Здесь код:

    var map;
    var featureLayer;

    require(["esri/map", "dojo/domReady!", "esri/layers/FeatureLayer"], function (Map) {
        map = new Map("map", {
            basemap: "topo",
            center: [-100.195, 39.567], // long, lat
            zoom: 4
        });

        featureLayer = new esri.layers.FeatureLayer(
            "http://my-server-url.com/arcgis/rest/services/Projects/MapServer/0",
            {
                mode: esri.layers.FeatureLayer.MODE_ONDEMAND
            }
        );

        map.addLayer(featureLayer);

    });

Теперь для конкретных вопросов:

  • Для чего требуется ([...], function (args) {} синтаксис? Я даже не знаю, как это прочитать. Является ли это вызовом функции require.js? квадратные скобки? Каковы аргументы функции?

  • Из других примеров, похоже, обычно должен быть один аргумент функции для каждого из них в вызове require.js. Но здесь, если я добавлю аргумент для FeatureLayer, это не сработает.

  • "dojo/domReady!" include, похоже, никогда не имеет соответствующего аргумента в любом примере. Связано ли это с восклицательным знаком? Что означает восклицательный знак?

  • Может ли кто-нибудь указать мне ПОЛЕЗНУЮ ссылку require.js? Сайт requirejs.org читает больше как техническую спецификацию, чем руководство пользователя. И веб-сайт ESRI, кажется, предполагает, что вы знаете, как его использовать.

И да, я был Googling - проблема в том, что Google не очень разбирается в вопросе о синтаксисе компьютера, так как он разделяет пунктуацию, и потому что "требуется синтаксис javascript" и т.п. сделать для crappy (over-wide) поисковые запросы.

Ответы

Ответ 1

  • Синтаксис require([...], function(args) { } говорит: "Загрузите этот список модулей, и как только они будут загружены, вызовите эту функцию с возвращаемыми значениями этих модулей в качестве аргументов". То, что находится в квадратных скобках, представляет собой массив либо путей к файлу script (минус .js), либо идентификаторов модулей, отображаемых с помощью путей require.config раздел. Аргументы функции обратного вызова соответствуют путям/модулям в массиве, но не все модули возвращают полезное значение, как вы заметили в следующем вопросе...

  • Добавление аргумента для FeatureLayer не работает, потому что вы не можете пропустить аргументы. Но обратите внимание, что многие модули фактически не возвращают значение, предназначенное для использования. Вы увидите это много с плагинами jQuery, где загрузка модуля просто регистрирует плагин с помощью jQuery, но не возвращает значение вызывающему. Я не знаю ESRI, но из фрагмента кода он выглядит как загрузка. FeatureLayer просто добавляет FeatureLayer к глобальному объекту esri.layers.

  • Синтаксис восклицательного знака зарезервирован для plugins. Как правило, после восклицательного знака будет что-то еще, указывающее ресурс, который загрузил бы плагин, например. text!myTemplate.html, но в случае domReady! плагин существует так же, как способ дождаться загрузки DOM до вызова вашей функции обратного вызова, поэтому ничто не должно следовать за восклицательным знаком.

  • Списки рекомендаций по внешним ресурсам вне темы для StackOverflow, но вот тот, который я нашел полезным для получения базовых понятий: http://aaronhardy.com/javascript/javascript-architecture-requirejs-dependency-management/

Ответ 2

Этот раздел документации requirejs описывает, что означает восклицательный знак в контексте domReady: http://requirejs.org/docs/api.html#pageload

Поскольку DOM ready является общей потребностью в приложении, в идеале можно было бы избежать вложенных функций в API выше. Модуль domReady также реализует API-интерфейс Loader Plugin, поэтому вы можете использовать синтаксис плагинов-загрузчиков (обратите внимание на зависимость domReady!), Чтобы заставить функцию обратного вызова require() ждать, пока DOM будет готова к выполнению.