Skip to content

Commit c4ee209

Browse files
committed
docs(module): edit Module
1 parent 9ed5c75 commit c4ee209

File tree

2 files changed

+52
-52
lines changed

2 files changed

+52
-52
lines changed

docs/module-loader.md

Lines changed: 2 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434

3535
`defer``async`的区别是:前者要等到整个页面正常渲染结束,才会执行;后者一旦下载完,渲染引擎就会中断渲染,执行这个脚本以后,再继续渲染。一句话,`defer`是“渲染完再执行”,`async`是“下载完就执行”。另外,如果有多个`defer`脚本,会按照它们在页面出现的顺序加载,而多个`async`脚本是不能保证加载顺序的。
3636

37-
## 加载规则
37+
### 加载规则
3838

3939
浏览器加载 ES6 模块,也使用`<script>`标签,但是要加入`type="module"`属性。
4040

@@ -256,7 +256,7 @@ $ babel-node main.js
256256

257257
这就证明了`x.js``y.js`加载的都是`C`的同一个实例。
258258

259-
## Node 的加载处理
259+
## Node 加载
260260

261261
### 概述
262262

@@ -728,56 +728,6 @@ $ node
728728
TypeError: even is not a function
729729
```
730730

731-
## 跨模块常量
732-
733-
本书介绍`const`命令的时候说过,`const`声明的常量只在当前代码块有效。如果想设置跨模块的常量(即跨多个文件),可以采用下面的写法。
734-
735-
```javascript
736-
// constants.js 模块
737-
export const A = 1;
738-
export const B = 3;
739-
export const C = 4;
740-
741-
// test1.js 模块
742-
import * as constants from './constants';
743-
console.log(constants.A); // 1
744-
console.log(constants.B); // 3
745-
746-
// test2.js 模块
747-
import {A, B} from './constants';
748-
console.log(A); // 1
749-
console.log(B); // 3
750-
```
751-
752-
如果要使用的常量非常多,可以建一个专门的`constants`目录,将各种常量写在不同的文件里面,保存在该目录下。
753-
754-
```javascript
755-
// constants/db.js
756-
export const db = {
757-
url: 'http://my.couchdbserver.local:5984',
758-
admin_username: 'admin',
759-
admin_password: 'admin password'
760-
};
761-
762-
// constants/user.js
763-
export const users = ['root', 'admin', 'staff', 'ceo', 'chief', 'moderator'];
764-
```
765-
766-
然后,将这些文件输出的常量,合并在`index.js`里面。
767-
768-
```javascript
769-
// constants/index.js
770-
export {db} from './db';
771-
export {users} from './users';
772-
```
773-
774-
使用的时候,直接加载`index.js`就可以了。
775-
776-
```javascript
777-
// script.js
778-
import {db, users} from './constants';
779-
```
780-
781731
## ES6模块的转码
782732

783733
浏览器目前还不支持ES6模块,为了现在就能使用,可以将转为ES5的写法。除了Babel可以用来转码之外,还有以下两个方法,也可以用来转码。

docs/module.md

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -570,6 +570,56 @@ console.log(exp(math.e));
570570

571571
上面代码中的`import exp`表示,将`circleplus`模块的默认方法加载为`exp`方法。
572572

573+
## 跨模块常量
574+
575+
本书介绍`const`命令的时候说过,`const`声明的常量只在当前代码块有效。如果想设置跨模块的常量(即跨多个文件),或者说一个值要被多个模块共享,可以采用下面的写法。
576+
577+
```javascript
578+
// constants.js 模块
579+
export const A = 1;
580+
export const B = 3;
581+
export const C = 4;
582+
583+
// test1.js 模块
584+
import * as constants from './constants';
585+
console.log(constants.A); // 1
586+
console.log(constants.B); // 3
587+
588+
// test2.js 模块
589+
import {A, B} from './constants';
590+
console.log(A); // 1
591+
console.log(B); // 3
592+
```
593+
594+
如果要使用的常量非常多,可以建一个专门的`constants`目录,将各种常量写在不同的文件里面,保存在该目录下。
595+
596+
```javascript
597+
// constants/db.js
598+
export const db = {
599+
url: 'http://my.couchdbserver.local:5984',
600+
admin_username: 'admin',
601+
admin_password: 'admin password'
602+
};
603+
604+
// constants/user.js
605+
export const users = ['root', 'admin', 'staff', 'ceo', 'chief', 'moderator'];
606+
```
607+
608+
然后,将这些文件输出的常量,合并在`index.js`里面。
609+
610+
```javascript
611+
// constants/index.js
612+
export {db} from './db';
613+
export {users} from './users';
614+
```
615+
616+
使用的时候,直接加载`index.js`就可以了。
617+
618+
```javascript
619+
// script.js
620+
import {db, users} from './constants';
621+
```
622+
573623
## import()
574624

575625
上面说过了,`import`语句会被JavaScript引擎静态分析,先于模块内的其他模块执行(叫做”连接“更合适)。所以,下面的代码会报错。

0 commit comments

Comments
 (0)