AMD: what is the purpose in javascript context? - Stack Overflow

admin管理员组

文章数量:1325720

Regarding AMD (Asynchronous Module Definition ) I read the phase like this:

The AMD format es from wanting a module format that was better than today's "write a bunch of script tags with implicit dependencies that you have to manually order" and something that was easy to use directly in the browser.

What is the the purpose in javascript context? Can you make some example? pro et contro of using AMD?

Regarding AMD (Asynchronous Module Definition ) I read the phase like this:

The AMD format es from wanting a module format that was better than today's "write a bunch of script tags with implicit dependencies that you have to manually order" and something that was easy to use directly in the browser.

What is the the purpose in javascript context? Can you make some example? pro et contro of using AMD?

• javascript
• javascript-framework
• js-amd

Share Improve this question Follow edited Apr 15, 2012 at 8:21 ThiefMaster 319k8585 gold badges605605 silver badges645645 bronze badges asked Apr 15, 2012 at 7:40 underscore666underscore666 1,73955 gold badges2424 silver badges3838 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 7

Long before JavaScript gained a native module system, the only way to put scripts onto a page were <script> elements. These executed in sequence, in the order they appear on the HTML. This means that if your script relied on jQuery, then jQuery's <script> has to e before your script's <script>. Otherwise, it blows up.

It's not unmon to logically split an app into multiple files, especially as the app grows. But using this system of manually ordering scripts bees a nightmare quickly. Your scripts have implicit dependencies whose management is defined elsewhere. This is where AMD es in.

AMD is a module specification and RequireJS is an implementation of such system. Simply put, it's a wrapper around your code that 1) keeps your script inert until invoked, 2) allows your script to explicitly define its dependencies and, 3) allows the module system to work out which dependencies execute in what order.

Here's a rough example:

// 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>

It's mon for Javascript libraries that depend on each other to require that they are loaded in a specific order. For example, the script tag that includes the jQuery library has to e before the script tag that includes the jQuery UI library.

If the libraries were using AMD, they could be included in any order. The AMD library would take care of initialising the libraries in the correct order, because you specify which library depenends on which.

(Somewhat ironically, the script tag that includes the AMD library of course has to e before the code that include any libraries using AMD...)

本文标签： AMD what is the purpose in javascript contextStack Overflow