require和import的区别

本文已参与「新人创作礼」活动，一起开启掘金创作之路

require和import的区别

1、遵循的规范不同

require遵循的是AMD规范；import是ES6新的语法标准

2、调用时间

require是运行时调用，代码运行时才会加载相应的模块，理论上可以运用在代码的任何地方

import是编译时调用，在代码编译时就会加载模块，速度更快，所以import必须放在文件开头

3、本质

require模块引入本质上是一个赋值过程，是值的引入，module.exports导出的内容是什么，require引入的就会是什么，如对象，函数，数组，字符串等，再把require的值赋值给某个变量

import是一个解构过程，但是目前浏览器引擎还没有实现import，在node中，import会被babel转成ES5执行，import最终会被转为require

2、require的用法

通过require方式引入基础数据类型时，时拷贝这个值，引入复杂数据类型时，如数组，对象等，属于浅拷贝

require() 函数用于在当前模块中加载别的模块。在函数内写入模块的路径即可（相对路径和绝对路径都行）

1. var foo1 = require('./foo'); // .js 扩展名可忽略
2. var foo2 = require('./foo.js');
4. var data = require('./data.json'); //不仅仅是 JS 文件，也可以是其他文件

require 相当于module.exports的传送门，module.exports 后面的内容是什么，require 的结果就是什么，比如对象、数字、字符串、函数等，然后再把 require 的结果赋值给某个变量。

require理论上可以运用在代码的任何地方，甚至不需要赋值给某个变量之后再使用，比如：

1. require('./a')(); //假设a模块是一个函数，此时将立即执行a模块函数
2. var data = require('./a').data; //假设a模块导出的是一个对象
3. var a = require('./a')[0]; //假设a模块导出的是一个数组

3、import | export 的用法

import 是编译时运行的（require是运行时的），它必须放在文件开头，而且使用格式也是确定的，不容置疑。它不会将整个模块运行后赋值给某个变量，而是只选择import的接口进行编译，这样在性能上比require好很多。

import | export 遵循 ES6 规范，支持编译时静态分析，便于JS引入宏和类型检验。动态绑定。写法比较多：

1. import fs from 'fs'
2. import {default as fs} from 'fs'
3. import * as fs from 'fs'
4. import {readFile} from 'fs'
5. import {readFile as read} from 'fs'