有人可以解释这个require.js示例中涉及的语法吗?

时间:2013-08-29 13:35:07

标签: javascript requirejs

我希望这个问题不是太宽泛,但是在这个特殊的require.js / ESRI示例中发生了很多不熟悉的语法,我希望有人可以向我解释一些。

首先,这段代码可以工作(也就是说,它可以完成我期望它做的事情):它创建一个基本地图并添加从地图服务中提取的FeatureLayer。它是ESRI Javascript API页面中的一个示例的精简版本。这是代码:

    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);

    });

现在针对特定问题:

  1. 这需要什么([...],函数(args){}语法?我甚至不知道如何阅读它。它是一个函数调用require.js?方括号中有什么?函数参数是什么?

  2. 从其他示例来看,看起来通常在require.js调用中每个include应该有一个函数参数。但是在这里,如果我为FeatureLayer添加一个参数,它就不起作用了。

  3. “dojo / domReady!” include似乎在任何示例中都没有相应的参数。这与感叹号有关吗?感叹号是什么意思?

  4. 有人能指出我有用的require.js参考吗? requirejs.org网站更像是技术规范,而不是用户手册。 ESRI网站似乎假设您知道如何使用require。

  5. 是的,我一直在谷歌搜索 - 问题是谷歌不擅长搜索计算机语法问题,因为它删除了标点符号,并且因为“需要javascript语法”等因为蹩脚(过度广泛)搜索条件。

2 个答案:

答案 0 :(得分:28)

  1. require([...], function(args) { }语法是说“加载这个模块列表,一旦加载完毕,就调用这个函数,并将这些模块的返回值作为参数” 。方括号中的内容是脚本文件的路径(减去.js)或使用require.config paths section映射的模块ID的数组。回调函数的参数对应于数组中的路径/模块,但并非所有模块都返回有用的值,正如您在下一个问题中所注意到的那样......

  2. 为FeatureLayer添加参数不起作用,因为您无法跳过参数。但请注意,许多模块实际上并未返回要使用的值。你会看到很多jQuery插件,其中模块的加载只是用jQuery注册插件但不向调用者返回值。我不知道ESRI,但是从代码片段看起来加载FeatureLayer只是将FeatureLayer添加到esri.layers全局对象。

  3. 感叹号语法保留给plugins。通常,在感叹号之后会有其他东西指示插件将加载的资源,例如, text!myTemplate.html,但在domReady!的情况下,插件的存在只是在调用回调函数之前等待DOM加载的方式,因此不需要遵循感叹号。

  4. 外部资源的推荐列表对于StackOverflow来说是偏离主题的,但我发现这是一个有助于获取基本概念的内容:http://aaronhardy.com/javascript/javascript-architecture-requirejs-dependency-management/

答案 1 :(得分:0)

requirejs文档的这一部分描述了感叹号在domReadyhttp://requirejs.org/docs/api.html#pageload

的上下文中的含义
  

由于DOM ready是一个常见的应用程序需求,理想情况下可以避免上面API中的嵌套函数。 domReady模块还实现了Loader Plugin API,因此您可以使用loader插件语法(注意domReady依赖关系中的!)强制require()回调函数在执行之前等待DOM准备就绪。