javascript中的require、import与export

参考：

js使用require 和 import 引入依赖的区别？

一文让你彻底搞清楚javascript中的require、import与export

菜鸟教程： 4.4 ES6 模块

w3school : ECMAScript 6 - ECMAScript 2015

w3school : ECMAScript 5 - JavaScript 5

Javascript不是一种模块化编程语言，在es6以前，它是不支持”类”（class），所以也就没有”模块”（module）了。

在 ES6 前， 实现模块化使用的是 RequireJS 或者 seaJS（分别是基于 AMD 规范的模块化库， 和基于 CMD 规范的模块化库）。

ES6 引入了模块化，其设计思想是在编译时就能确定模块的依赖关系，以及输入和输出的变量。

ES6 的模块化分为导出（export） @与导入（import）两个模块。

参考：

Javascript(es2016) import和require用法和区别

import只能用于静态导入，就是必须在文件开始的时候，在最上层就写好。而require就可以实现动态加载。

加载方式	规范	命令	特点
运行时加载	CommonJS/AMD	require	社区方案，提供了服务器/浏览器的模块加载方案。非语言层面的标准。只能在运行时确定模块的依赖关系及输入/输出的变量，无法进行静态优化。
编译时加载	ESMAScript6+	import	语言规格层面支持模块功能。支持编译时静态分析，便于JS引入宏和类型检验。动态绑定。

一.require

require是Commonjs的规范，node应用是由模块组成的，遵从commonjs的规范。用法：

a.js

function test (args) {
  // body...
  console.log(args);
}

module.exports = {
  test
};

b.js

let { test } = require('./a.js');

test('this is a test.');

require的核心概念：

• 在导出的文件中定义module.exports，导出的对象类型不予限定（可为任意类型）。

• 在导入的文件中使用require()引入即可使用。

• 本质上，是将要导出的对象，赋值给module这个对象的exports属性，
  在其他文件中通过require这个方法来访问exports这个属性。
  上面b.js中，require(./a.js) = exports 这个对象，然后使用es6取值方式从exports对象中取出test的值。

二.import

import是es6为js模块化提出的新的语法，import （导入）要与export（导出）结合使用。用法：

a.js:

export function test (args) {
  // body...
  console.log(args);
}

// 默认导出模块，一个文件中只能定义一个
export default function() {
    console.log("export default");
};

export const name = "lyn";

b.js:

// _代表引入的export default的内容
import _, { test, name } from './a.js';

test(`my name is ${name}`);

三、commonjs模块与ES6模块的区别

• 1.commonjs输出的，是一个值的拷贝，而es6输出的是值的引用；

• 2.commonjs是运行时加载，es6是编译时输出接口；