每日一题(六二):简述 import 原理,与 require 有什么不同

简述 import 原理,与 require 有什么不同

答案:

import 原理(实际上就是 ES6 module 的原理)

1.简单来说就是闭包的运用

2.为了创建 Module 的内部作用域,会调用一个包装函数

3.包装函数的返回值也就是 Module 向外公开的 API,也就是所有 export 出去的变量

4.import 也就是拿到 module 导出变量的引用

与 require 的不同

CommonJS 模块输出的是一个值的拷贝,ES6 模块输出的是值的引用

CommonJS 模块是运行时加载,ES6模块是编译时输出接口,编译时加载(效率更高由于是编译时加载,所以 import 命令会提升到整个模块的头部)

CommonJS 是运行时加载对应模块,一旦输出一个值,即使模块内部对其做出改变,也不会影响输出值,如:

// module  a.js
var a = 1;
function changeA(val){
    a = val;
}
 
module.exports = {
    a:a,
    changeA:changeA,
}

// module b.js
var modA = require('./a.js');
console.log('first',modA.a); //  1
modA.changeA(2);
console.log('second',modA.a); //  1

而 ES6 模块则不同,import 导入是在 JS 引擎对脚本静态分析时确定,获取到的只是一个只读的引用。等脚本正在运行时,会根据这个引用去对应的模块中取值。所以引用对应的值发生改变时,其导入的值也会发生改变。

CommonJs模块默认采用非严格模式,ES6 的模块自动采用严格模式(无论你加不加 "use strict")

猜你喜欢

转载自blog.csdn.net/MFWSCQ/article/details/108365307