【问题标题】:AMD: what is the purpose in javascript context?AMD:javascript上下文的目的是什么?
【发布时间】:2012-04-26 23:15:57
【问题描述】:

关于 AMD(异步模块定义)我读到这样的阶段:

AMD 格式源于想要一种比 今天的“写一堆带有隐式依赖的脚本标签 您必须手动订购”以及易于使用的东西 直接在浏览器中。

javascript 上下文的目的是什么?你能举个例子吗?赞成和控制使用 AMD?

【问题讨论】:

    标签: javascript javascript-framework js-amd


    【解决方案1】:

    早在 JavaScript 获得原生模块系统之前,将脚本放到页面上的唯一方法是 <script> 元素。这些按顺序执行,按照它们在 HTML 中出现的顺序。这意味着如果你的脚本依赖于 jQuery,那么 jQuery 的 <script> 必须在你的脚本的 <script> 之前。否则,它会爆炸。

    将应用程序逻辑拆分为多个文件的情况并不少见,尤其是随着应用程序的增长。但是使用这种手动排序脚本的系统很快就会变成一场噩梦。您的脚本具有隐式依赖关系,其管理在其他地方定义。这就是 AMD 的用武之地。

    AMD 是一个模块规范,而 RequireJS 是这样一个系统的实现。简而言之,它是您代码的包装器,它 1) 在调用之前保持脚本惰性,2) 允许您的脚本显式定义其依赖项,以及 3) 允许模块系统计算出哪些依赖项以什么顺序执行。

    这是一个粗略的例子:

    // your-app.js
    define(['jquery', 'underscore'], function($, _){
      // Your script sits in this "wrapper" function.
      // RequireJS now knows app.js needs jquery and underscore.
      // It loads and executes them first before your script.
    })
    
    // jquery.js
    define('jquery', [], function(){
      // jQuery stuff
      return jQuery
    })
    
    // underscore.js
    define('underscore', [], function(){
      // underscore stuff
      return underscore
    })
    
    // Then on your HTML, load up your app.
    <script data-main="path/to/app.js" src="path/to/require.js"></script>
    

    【讨论】:

    • in require(['jQuery','underscore'],function($,_){ } -- 仅按该顺序加载 jQuery 和下划线。假设下划线中的函数正在使用jQuery,它会正常工作吗?
    • @AnkurMarwaha 在这种情况下,下划线 depends 取决于 jQuery。 Underscore 必须将 jQuery 定义为其依赖项,以便 jQuery 首先加载。应该担心的不是您的代码。此外,该数组中的依赖项不会按该顺序加载或执行。
    【解决方案2】:

    相互依赖的 Javascript 库通常要求以特定顺序加载它们。例如,包含 jQuery 库的 script 标签必须位于包含 jQuery UI 库的 script 标签之前。

    如果库使用 AMD,则可以按任何顺序包含它们。 AMD 库会负责以正确的顺序初始化库,因为您可以指定哪个库依赖于哪个库。

    (有点讽刺的是,包含 AMD 库的脚本标签当然必须位于包含任何使用 AMD 的库的代码之前...)

    【讨论】:

      猜你喜欢
      • 2011-05-11
      • 2013-03-04
      • 2012-08-27
      • 2021-01-16
      • 2014-01-24
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多