require 和 import 是不同模块化规范下引入模块的语句（CommonJS 和 ES6）

1. 主要区别

区别	import	require
加载	编译时加载（静态加载）	运行时加载（动态加载）
导入	可以导入模块中的所有导出内容或者部分导出内容	导入整个模块对象，不能仅导入部分内容
导出	import/export 模块输出的是值的映射，导出的值可以变化（输出值的映射）	require/exports 输出的是值的拷贝。也就是说，一旦输出一个值，模块内部的变化就影响不到这个值。(输出值的拷贝)
书写位置	必须写在文件的顶部	可以写在代码任何地方执行比如函数、判断语句当中
性能	性能较高，因为 import 只需要依据 import 中的接口在编译时引入指定模块所以性能稍高	性能较低，因为 require 是在运行时才引入模块并且还赋值给某个变量

1.1 值的拷贝和值的映射示例：

var a = 6
export default {a}
a = 7  //在es6中的export可以

var a = 6
module.export = a
a = 7   //在common.js中，这样是错误的

2. 区别的补充

2.1 import/export 不能对引入模块重新赋值/定义

2.2 ES6 模块可在 import 引用语句前使用模块，CommonJS 需先引用后使用

ES6 模块
//webUtils.js
export var e='foo';

console.log(e) // 'foo'
import {e} from './webUtils.js';
console.log(e) // 'foo'

CommonJS
//utils.js
exports.e = 'foo';

console.log(a) // 报错 ReferenceError: a is not defined
a = require('./utils');
console.log(a) // 'foo'

2.3 是否采用严格模式

• import/export 导出的模块默认调用严格模式。
• require/exports 默认不使用严格模式，可以自定义是否使用严格模式。

3. 其他模块化方法

3.1 动态导入 import()

import(modulePath)表达式加载模块并返回一个 promise，该 promise resolve 为一个包含其所有导出的模块对象。

我们可以在代码中的任意位置动态地使用它。例如：

import('/modules/my-module.js') //动态导入
  .then((module) => {
    // Do something with the module.
});

注意： 不要滥用动态导入 import()（必要情况下再采用）。