1
0
mirror of https://github.com/ruanyf/es6tutorial.git synced 2025-05-24 18:32:22 +00:00

docs(module): edit import()

This commit is contained in:
ruanyf 2017-07-02 17:26:56 +08:00
parent e35fcfda61
commit b9bd59dbe2
2 changed files with 9 additions and 9 deletions

View File

@ -475,11 +475,11 @@ CommonJS的一个模块就是一个脚本文件。`require`命令第一次加
以后需要用到这个模块的时候,就会到`exports`属性上面取值。即使再次执行`require`命令也不会再次执行该模块而是到缓存之中取值。也就是说CommonJS模块无论加载多少次都只会在第一次加载时运行一次以后再加载就返回第一次运行的结果除非手动清除系统缓存。
### CommonJS模块的循环加载
### CommonJS 模块的循环加载
CommonJS模块的重要特性是加载时执行即脚本代码在`require`的时候,就会全部执行。一旦出现某个模块被"循环加载",就只输出已经执行的部分,还未执行的部分不会输出。
CommonJS 模块的重要特性是加载时执行,即脚本代码在`require`的时候,就会全部执行。一旦出现某个模块被"循环加载",就只输出已经执行的部分,还未执行的部分不会输出。
让我们来看Node[官方文档](https://nodejs.org/api/modules.html#modules_cycles)里面的例子。脚本文件`a.js`代码如下。
让我们来看Node [官方文档](https://nodejs.org/api/modules.html#modules_cycles)里面的例子。脚本文件`a.js`代码如下。
```javascript
exports.done = false;
@ -556,9 +556,9 @@ exports.bad = function (arg) {
上面代码中,如果发生循环加载,`require('a').foo`的值很可能后面会被改写,改用`require('a')`会更保险一点。
### ES6模块的循环加载
### ES6 模块的循环加载
ES6处理“循环加载”与CommonJS有本质的不同。ES6模块是动态引用如果使用`import`从一个模块加载变量(即`import foo from 'foo'`),那些变量不会被缓存,而是成为一个指向被加载模块的引用,需要开发者自己保证,真正取值的时候能够取到值。
ES6 处理“循环加载”与CommonJS有本质的不同。ES6模块是动态引用如果使用`import`从一个模块加载变量(即`import foo from 'foo'`),那些变量不会被缓存,而是成为一个指向被加载模块的引用,需要开发者自己保证,真正取值的时候能够取到值。
请看下面这个例子。
@ -590,7 +590,7 @@ bar
接着,`b.js`要打印变量`foo`,这时`a.js`还没执行完,取不到`foo`的值,导致打印出来是`undefined``b.js`执行完,开始执行`a.js`,这时就一切正常了。
再看一个稍微复杂的例子(摘自 Dr. Axel Rauschmayer 的[《Exploring ES6》](http://exploringjs.com/es6/ch_modules.html))。
再看一个稍微复杂的例子(摘自 Axel Rauschmayer 的[《Exploring ES6》](http://exploringjs.com/es6/ch_modules.html))。
```javascript
// a.js
@ -612,7 +612,7 @@ export function bar() {
}
```
按照CommonJS规范上面的代码是没法执行的。`a`先加载`b`,然后`b`又加载`a`,这时`a`还没有任何执行结果,所以输出结果为`null`,即对于`b.js`来说,变量`foo`的值等于`null`,后面的`foo()`就会报错。
按照 CommonJS 规范,上面的代码是没法执行的。`a`先加载`b`,然后`b`又加载`a`,这时`a`还没有任何执行结果,所以输出结果为`null`,即对于`b.js`来说,变量`foo`的值等于`null`,后面的`foo()`就会报错。
但是ES6可以执行上面的代码。
@ -667,7 +667,7 @@ export function bar() {
}
```
我们再来看ES6模块加载器[SystemJS](https://github.com/ModuleLoader/es6-module-loader/blob/master/docs/circular-references-bindings.md)给出的一个例子。
我们再来看 ES6 模块加载器[SystemJS](https://github.com/ModuleLoader/es6-module-loader/blob/master/docs/circular-references-bindings.md)给出的一个例子。
```javascript
// even.js

View File

@ -635,7 +635,7 @@ if (x === 2) {
上面代码中,引擎处理`import`语句是在编译时,这时不会去分析或执行`if`语句,所以`import`语句放在`if`代码块之中毫无意义,因此会报句法错误,而不是执行时错误。也就是说,`import``export`命令只能在模块的顶层,不能在代码块之中(比如,在`if`代码块之中,或在函数之中)。
这样的设计,固然有利于编译器提高效率,但也导致无法在运行时加载模块。语法上,条件加载就不可能实现。如果`import`命令要取代 Node 的`require`方法,这就形成了一个障碍。因为`require`是运行时加载模块,`import`命令无法取代`require`的动态加载功能。
这样的设计,固然有利于编译器提高效率,但也导致无法在运行时加载模块。语法上,条件加载就不可能实现。如果`import`命令要取代 Node 的`require`方法,这就形成了一个障碍。因为`require`是运行时加载模块,`import`命令无法取代`require`的动态加载功能。
```javascript
const path = './' + fileName;