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

docs(module): edit module

This commit is contained in:
ruanyf 2016-12-06 12:47:50 +08:00
parent e26aa6be60
commit c9df99c2f7

View File

@ -347,19 +347,19 @@ export default foo;
下面比较一下默认输出和正常输出。
```javascript
// 输出
export default function crc32() {
// 第一组
export default function crc32() { // 输出
// ...
}
// 输入
import crc32 from 'crc32';
// 输出
export function crc32() {
import crc32 from 'crc32'; // 输入
// 第二组
export function crc32() { // 输出
// ...
};
// 输入
import {crc32} from 'crc32';
import {crc32} from 'crc32'; // 输入
```
上面代码的两组写法,第一组是使用`export default`时,对应的`import`语句不需要使用大括号;第二组是不使用`export default`时,对应的`import`语句需要使用大括号。
@ -399,18 +399,32 @@ export default var a = 1;
上面代码中,`export default a`的含义是将变量`a`的值赋给变量`default`。所以,最后一种写法会报错。
有了`export default`命令,输入模块时就非常直观了,以输入jQuery模块为例。
有了`export default`命令,输入模块时就非常直观了,以输入 lodash 模块为例。
```javascript
import $ from 'jquery';
import _ from 'lodash';
```
如果想在一条import语句中同时输入默认方法和其他变量可以写成下面这样。
如果想在一条`import`语句中,同时输入默认方法和其他变量,可以写成下面这样。
```javascript
import customName, { otherMethod } from './export-default';
import _, { each } from 'lodash';
```
对应上面代码的`export`语句如下。
```javascript
export default function (obj) {
// ···
}
export function each(obj, iterator, context) {
// ···
}
export { each as forEach };
```
上面代码的最后一行的意思是,暴露出`forEach`接口,默认指向`each`接口,即`forEach``each`指向同一个方法。
如果要输出默认的值,只需将值跟在`export default`之后即可。
```javascript
@ -432,6 +446,34 @@ let o = new MyClass();
如果在一个模块之中,先输入后输出同一个模块,`import`语句可以与`export`语句写在一起。
```javascript
export { foo, bar } from 'my_module';
// 等同于
import { foo, bar } from 'my_module';
export { foo, boo};
```
上面代码中,`export``import`语句可以结合在一起,写成一行。
模块的改名输出和整体输出,也可以采用这种写法。
```javascript
// 改名输出
export { foo as myFoo } from 'my_module';
// 整体输出
export * from 'my_module';
```
默认输出的写法如下。
```javascript
export { default } from 'foo';
```
将某个接口改为默认输出的写法如下。
```javascript
export { es6 as default } from './someModule';
@ -440,7 +482,11 @@ import { es6 } from './someModule';
export default es6;
```
上面代码中,`export``import`语句可以结合在一起,写成一行。但是从可读性考虑,不建议采用这种写法,而应该采用标准写法。
同样地,默认输出也可以改名为具名接口。
```javascript
export { default as es6 } from './someModule';
```
另外ES7有一个[提案](https://github.com/leebyron/ecmascript-more-export-from),简化先输入后输出的写法,拿掉输出时的大括号。
@ -1088,7 +1134,7 @@ $ compile-modules convert -o out.js file1.js
另一种解决方法是使用 [SystemJS](https://github.com/systemjs/systemjs)。它是一个垫片库polyfill可以在浏览器内加载 ES6 模块、AMD 模块和 CommonJS 模块,将其转为 ES5 格式。它在后台调用的是 Google 的 Traceur 转码器。
使用时先在网页内载入system.js文件。
使用时,先在网页内载入`system.js`文件。
```html
<script src="system.js"></script>