美文网首页
AMD_CMD_RequireJS

AMD_CMD_RequireJS

作者: QQQQQCY | 来源:发表于2017-08-24 14:44 被阅读0次

    题目1: 为什么要使用模块化?


    • 最主要的目的:

      • 解决命名冲突
      • 依赖管理
    • 其他价值

      • 提高代码可读性
      • 代码解耦,提高复用性

    题目2: CMD、AMD、CommonJS 规范分别指什么?有哪些应用


    CMD 规范

    CMDCommon Module Definition)是 SeaJS 在推广过程中对模块定义的规范化产出
    AMD 的不同在于,AMD 推崇依赖前置会在一开始加载好所有需要的模块,而 CMD 则推崇依赖就近,当需要时才加载

    //  初始化
    seajs.use(["init.js"],function(init){})
    
    //init.js
    define(function(require, exports, module) {
      var math = require('math')
      console.log(math.add(1,2))  //  3
    });
    
    //math.js
     define(function(require, exports, module){
        var Add = function(x,y){    
            return x + y
        }
        return {
            add: Add
        }
     })
    

    AMD 规范

    AMDAsynchronous Module Definition),中文名是异步模块定义的意思。它是一个在浏览器端模块化开发的规范

    由于不是JavaScript原生支持,使用AMD规范进行页面开发需要用到对应的库函数,也就是大名鼎鼎RequireJS,实际上AMD 是 RequireJS 在推广过程中对模块定义的规范化的产出

    //   main.js
    require(['math'],function(math){
        console.log(math.add(1,2))  //  3
    })
    
    //math.js
    define(function(){
        var Add = function(x,y){    
            return x + y
        }
        return {
            add: Add
        }
    })
    

    CommonJS 规范

    CommonJS 是服务器端模块的规范,Node.js采用了这个规范。Node.JS首先采用了js模块化的概念。

    1. 在一个模块中,存在一个自由的变量”require”,它是一个函数。

      • 这个require函数接收一个模块标识符。
      • require返回外部模块所输出的API。
      • 如果出现依赖闭环( dependency cycle ),那么外部模块在被它的传递依赖(transitive dependencies)所require的时候可能并没有执行完成;在这种情况下,require返回的对象必须至少包含此外部模块在调用require函数(会进入当前模块执行环境)之前就已经准备完毕的输出。
      • 如果请求的模块不能返回,那么require必须抛出一个错误。
    2. 在一个模块中,会存在一个名为exports的自由变量,它是一个对象,模块可以在执行的时候把自身的API加入到其中。

    3. 模块必须使用exports对象来做为输出的唯一表示。

    //  node.js 中启动 init.js
    var math = require ( 'math.js' )
    console.log ( math.add (1, 2 ) )   //  3
    
    //  math.js
    var Add = function(x,y){    
        return x + y
    }
    module.exports = {
        add: Add
    }
    

    参考
    SeaJS模块加载器超简教程
    前端模块化,AMD与CMD的区别

    题目3: 使用 requirejs 完善入门任务15,包括如下功能:

    git - 预览

    相关文章

      网友评论

          本文标题:AMD_CMD_RequireJS

          本文链接:https://www.haomeiwen.com/subject/oygurxtx.html