八股文不用背-require和import的区别

链接：require和import的区别

require是commonjs规范

// add.js
let a = 0
module.export.a = a
module.export.add = function(){
    a++
}
// index.js
let obj = require('./add.js')
console.log(obj.a)    // 0
obj.add()
console.log(obj.a)    // 0

js有个全局的module对象，每个js文件的module对象，它有如下属性

• module.id：唯一编号
• module.filename：文件路径
• module.children：引用到的子模块
• module.loaded：是否被加载了
• module.export：该文件导出的对象

它有如下特性

• 运行时加载-动态加载模块
• 引入的是对应模块的export对象，引用方可以改这个对象
• 模块内有个export内置变量，指向的就是module.export，可以修改为别的，但是模块就没有导出了，所以不推荐用这个变量。
• 删除模块缓存：delete require.cache[moduleName]

import是es模块

模块内部export出变量，然后给外部引用

// add.js
export const a = 0
export default 2
export {a as b}
export function add(){
    a++
}
 
// index.js
import {a,add,default} from './add.js'
console.log(a)  // 0
add()
console.log(a)  // 1
console.log(default)

import有如下特性

• 编译时加载模块（静态加载）
• 模块内部的export 后跟变量声明+赋值，不能直接跟变量/字面量
• 变量提升，编译时干的事情，一般都会变量提升，所以import语句会被移动到代码顶部，然后编译阶段先解析
• import后的东西不能是表达式，因为import是编译阶段执行的
• import的变量是只读的，修改会报错