require和import的区别?
-
require是commonJS规范,import是ES6规范,通过require引入基础数据类型时,属于复制该变量。通过require引入复杂数据类型时,属于浅拷贝该对象。(同时导出与引用方式不同)
// import 的导出方式 let obj = { name: 'zs', age: 18 } let sayHello = function (){ console.log('Hello'); } // 第一种导出方式 export default { obj } // 第二种导出方式 export { obj, sayHello } // import的引用方式 import {obj,sayHello} from './import' // require 的导出方式 let obj = { name:'zs', age:18 } module.exports = { obj } // require的导入方式 const {obj} = require('./require')
-
require是同步执行,import是异步执行(import也被浏览器支持)
// 如果第一个require没有执行结束,后面代码不会执行(会产生阻塞)
const {obj1} = require('./a')
const {obj2} = require('./b')
const {obj3} = require('./c')
// import是异步加载,谁先加载完就会先执行谁(不会产生阻塞)
import {obj1} from './a'
import {obj2} from './b'
import {obj3} from './c'
-
require是运行时编译,import是编译阶段执行,在代码执行前
// 这里会报错,因为这里要先require引入之后才能够获取到obj1,这就是运行时加载 console.log(obj1); const {obj1} = require('./a') 1 // 这里可以正常输出,是因为代码先进行了编译,所以不会出现错误 console.log(obj2); import {obj2} from './b'