zoukankan      html  css  js  c++  java
  • 模块加载规范对比

    一、commonJS模块加载规范

    CommonJS规范加载模块是同步的,也就是说,只有加载完成,才能执行后面的操作。由于Node.js主要用于服务器编程,模块文件一般都已经存在于本地硬盘,所以加载起来比较快,不用考虑非同步加载的方式,所以CommonJS规范比较适用。浏览器端一般采用AMD模块加载方式或者ES6的模块加载标准。

    模块导出方法(为防止混淆,建议一律采用module.exports而非exports):

    模块导入方法:利用require

    //文件a.js
    module.exports=function(){
      console.log('a');  
    }
    
    //在文件b中使用
    var a=require('./a.js');
    a();
    
    /*在文件a.js中利用对象的形式导出*/
    module.exports.a=function(){
        console.log('a');
    };
    //在文件b中使用
    var obj=require('./a.js');
    obj.a();
    var a=require(filePath);

    需了解模块加载规则:

    (1)如果参数字符串以“/”开头,则表示加载的是一个位于绝对路径的模块文件。比如,require('/home/marco/foo.js')将加载/home/marco/foo.js

    (2)如果参数字符串以“./”开头,则表示加载的是一个位于相对路径(跟当前执行脚本的位置相比)的模块文件。比如,require('./circle')将加载当前脚本同一目录的circle.js

    (3)如果参数字符串不以“./“或”/“开头,则表示加载的是一个默认提供的核心模块(位于Node的系统安装目录中),或者一个位于各级node_modules目录的已安装模块(全局安装或局部安装)

    (4)如果指定的模块文件没有发现,Node会尝试为文件名添加.js.json.node后,再去搜索。.js件会以文本格式的JavaScript脚本文件解析,.json文件会以JSON格式的文本文件解析,.node文件会以编译后的二进制文件解析。

    (6)如果想得到require命令加载的确切文件名,使用require.resolve()方法。

    二、ES6模块加载规范

    在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种。前者用于服务器,后者用于浏览器。ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。

    ES6 模块的设计思想,是尽量的静态化,使得编译时就能确定模块的依赖关系,以及输入和输出的变量。CommonJS 和 AMD 模块,都只能在运行时确定这些东西。

    ES6的模块命令主要包括export和import,

    // profile.js
    var firstName = 'Michael';
    var lastName = 'Jackson';
    var year = 1958;
    
    export {firstName, lastName, year};
    import {firstName, lastName, year} from './profile';

    此外还有export default命令

    从前面的例子可以看出,使用import命令的时候,用户需要知道所要加载的变量名或函数名,否则无法加载。但是,用户肯定希望快速上手,未必愿意阅读文档,去了解模块有哪些属性和方法。

    为了给用户提供方便,让他们不用阅读文档就能加载模块,就要用到export default命令,为模块指定默认输出。

    export default function () {
      console.log('foo');
    }

    上面代码是一个模块文件export-default.js,它的默认输出是一个函数。

    其他模块加载该模块时,import命令可以为该匿名函数指定任意名字。

    // import-default.js
    import customName from './export-default';
    customName(); // 'foo'
  • 相关阅读:
    搭建VueMint-ui框架
    vue项目创建
    jQuery选择器总结
    位运算
    Hash哈希
    并发编程(六)并发容器
    并发编程(五)AQS
    并发编程(四)显示锁
    Java中的几种代码块
    并发编程(三)原子操作CAS
  • 原文地址:https://www.cnblogs.com/bobodeboke/p/7047714.html
Copyright © 2011-2022 走看看