AMD(Asynchronous Module Definition) - amd, asynchronous, definition, module

The Asynchronous Module Definition Specification (AMD) formulates rules for defining modules so that modules and their dependencies can be loaded asynchronously. This just adapts to the browser’s asynchronous loading module environment (the browser’s synchronous loading of modules will cause performance, usability, debugging, and cross-domain access issues).

API description

define( )Function

This specification defines only one function “define”, which is a global variable. The description of the function is:

define(id?,dependencies? ,factory);

ID span>

Name

The first parameter, ID is a string. It specifies the name of the module in the definition. This parameter is optional. If this parameter is not provided, the name of the module should default to the name of the specified script requested by the module loader. If this parameter is provided, the module name must be “top-level” and “absolute” (relative names are not allowed).

Module name format

Module names are used to uniquely identify the modules in the definition, and they are also used in dependent data. AMD’s module name specification is a superset of the CommonJs module name specification. The quote is as follows:

The module name is a string of one or more words concatenated with forward slashes as separators
Words must be in camel case, or “.”, “..”
Module names do not allow file extensions, such as “.js”
Module The name can be “relative” or “top-level”. If the first character is “.” or “..”, it is the “relative” module name
The top-level module name is named from the root Conceptual module analysis of space
Relative module name is resolved from the module written and called by “require”

The CommonJs module ID attribute cited above is often used in JavaScript modules.

Relative module name resolution example:

If the module “a/b/c” requests “../d”, it will be parsed as “a/d”
If the module “a/b/c” requests “./e”, it will be parsed as “a/b/e”

dependency

The second parameter, dependencies, is an array of modules that the modules in the definition depend on. The dependent module must be executed according to the module’s factory method priority, and the result of the execution should be passed into the factory method (of the module in the definition) in the form of parameters in the order of position in the dependent data.

If the dependent module name is relative, it should be resolved into the relative definition Module. In other words, the relative name resolves to the name relative to the module, not relative to the path to find the name of the module.

This specification defines three special keywords. If “require”, “exports”, or “module” appears in the dependency list, the parameters should be parsed according to the commonJs module specification and free variables.

The dependent parameters are optional. If this parameter is omitted, it should default to [“require”,”exports”,””module”]. However, if the number of parameters of the factory method is less than 3, the loader will choose to call the factory method with the number of parameters specified by the function .

Factory method span>

Third A parameter, factory, is the function or object to be executed when the module is initialized. If it is a function, it should only be executed once. If it is an object, this object should be the output value of the module.

If the factory method returns a value (object, function, or any value that is cast to true), it should be set to the output value of the module .

Simple commonJs conversion

If the dependency parameter is ignored, the module loader can choose Scan the require statement in the factory method to obtain dependencies (the literal form is require(“module-id”)). The first parameter must be literally require for this mechanism to work properly.

In some cases, the toString method (Opera Mobile is a known toString method that does not support functions), the module loader can choose to scan without scanning dependencies.

If there are dependent parameters, the module loader should not be in the factory Scan dependency in the method.

define.amd attribute

In order to clearly identify the global function (necessary for the browser to load the script) and comply with the AMD programming interface, any global function should have an “amd” attribute, which is The value is an object. This prevents conflicts with existing codes that define define functions but do not comply with the AMD programming interface.

Currently, the attributes of the define.amd object are not included in this specification. Authors who implement this specification can use it to notify additional capabilities beyond the basic implementation of the programming interface of this specification.

The existence of define.amd indicates that the function complies with this specification. If there is another version of the programming interface, then another attribute should be defined, such as define.amd2, indicating that the implementation only follows this version of the programming interface.

span>How to define an implementation of a module that allows multiple loading of the same version in the same environment:

define.amd = {
multiversion: true
multiversion: true
span style=”font-size:24px”>};

The shortest definition:

define.amd = {};

Output multiple modules at once h2> Multiple define calls can be used in a script. The order of these define calls should not be important. Dependencies specified in earlier module definitions can be defined later in the same script. The module loader is responsible for delaying loading of unresolved dependencies until all scripts are loaded to prevent unnecessary requests.

Example

Use require and exports

Create a module named “alpha”, the usage rate requires, exports, and a module named “beta”:

define(“alpha”, [“require”, “exports”, “beta”] , function (require, exports, beta) {
exports.verb = function() {
return beta.verb();
//Or:
return require(“beta”).verb();
}
});

An anonymous module that returns objects:


define([“alpha”], function (alpha) {
return {
verb: function(){
return alpha.verb() + 2;
}

A module without dependencies can directly define objects:

define({
add: function(x, y){
return x + y;
}
});

A module definition that uses a simple CommonJS conversion:

 define(function (require, exports, module) {var a = require(‘a’), b = require(‘b’); exports.action = function () {}; });

Leave a Comment Cancel reply