mirror of
https://github.com/ruanyf/es6tutorial.git
synced 2025-05-29 05:42:20 +00:00
edit destruring
This commit is contained in:
ruanyf
parent
c6d6fa358b
commit
22afca322c
@ -108,8 +108,8 @@ const [v1, v2, ..., vN ] = array;
|
||||
对于Set结构，也可以使用数组的解构赋值。
|
||||
|
||||
```javascript
|
||||
[a, b, c] = new Set(["a", "b", "c"])
|
||||
a // "a"
|
||||
let [x, y, z] = new Set(["a", "b", "c"])
|
||||
x // "a"
|
||||
```
|
||||
|
||||
事实上，只要某种数据结构具有Iterator接口，都可以采用数组形式的解构赋值。
|
||||
@ -128,7 +128,7 @@ var [first, second, third, fourth, fifth, sixth] = fibs();
|
||||
sixth // 5
|
||||
```
|
||||
|
||||
上面代码中，fibs是一个Generator函数，原生具有Iterator接口。解构赋值会依次从这个接口获取值。
|
||||
上面代码中，`fibs`是一个Generator函数，原生具有Iterator接口。解构赋值会依次从这个接口获取值。
|
||||
|
||||
## 对象的解构赋值
|
||||
|
||||
@ -165,6 +165,14 @@ f // 'hello'
|
||||
l // 'world'
|
||||
```
|
||||
|
||||
这实际上说明，对象的解构赋值是下面形式的简写（参见《对象的扩展》一章）。
|
||||
|
||||
```javascript
|
||||
var { foo: foo, bar: bar } = { foo: "aaa", bar: "bbb" };
|
||||
```
|
||||
|
||||
也就是说，对象的解构赋值的内部机制，是先找到同名属性，然后再赋给对应的变量。
|
||||
|
||||
和数组一样，解构也可以用于嵌套结构的对象。
|
||||
|
||||
```javascript
|
||||
@ -203,9 +211,9 @@ var {x = 3} = {x: null};
|
||||
x // null
|
||||
```
|
||||
|
||||
上面代码中，如果x属性等于null，就不严格相等于undefined，导致默认值不会生效。
|
||||
上面代码中，如果`x`属性等于`null`，就不严格相等于`undefined`，导致默认值不会生效。
|
||||
|
||||
如果解构失败，变量的值等于undefined。
|
||||
如果解构失败，变量的值等于`undefined`。
|
||||
|
||||
```javascript
|
||||
var {foo} = {bar: 'baz'}
|
||||
@ -219,7 +227,7 @@ foo // undefined
|
||||
var {foo: {bar}} = {baz: 'baz'}
|
||||
```
|
||||
|
||||
上面代码中，等号左边对象的foo属性，对应一个子对象。该子对象的bar属性，解构时会报错。原因很简单，因为foo这时等于undefined，再取子属性就会报错，请看下面的代码。
|
||||
上面代码中，等号左边对象的`foo`属性，对应一个子对象。该子对象的`bar`属性，解构时会报错。原因很简单，因为`foo`这时等于`undefined`，再取子属性就会报错，请看下面的代码。
|
||||
|
||||
```javascript
|
||||
var _tmp = {baz: 'baz'};
|
||||
@ -266,7 +274,7 @@ d // "l"
|
||||
e // "o"
|
||||
```
|
||||
|
||||
类似数组的对象都有一个length属性，因此还可以对这个属性解构赋值。
|
||||
类似数组的对象都有一个`length`属性，因此还可以对这个属性解构赋值。
|
||||
|
||||
```javascript
|
||||
let {length : len} = 'hello';
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
|
||||
ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准，已经在2015年6月正式发布了。它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。
|
||||
|
||||
标准的制定者有计划，以后每年发布一次标准，使用年份作为标准的版本。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015。也就是说，ES6就是ES2015。
|
||||
标准的制定者有计划，以后每年发布一次标准，使用年份作为标准的版本。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015。也就是说，ES6就是ES2015，下一年应该会发布小幅修订的ES2016。
|
||||
|
||||
## ECMAScript和JavaScript的关系
|
||||
|
||||
@ -146,7 +146,7 @@ $ babel-node es6.js
|
||||
[1, 4, 9]
|
||||
```
|
||||
|
||||
babel命令可以将ES6代码转为ES5代码。
|
||||
`babel`命令可以将ES6代码转为ES5代码。
|
||||
|
||||
```bash
|
||||
$ babel es6.js
|
||||
@ -403,7 +403,7 @@ fs.writeFileSync('out.js.map', result.sourceMap);
|
||||
|
||||
2013年3月，ES6的草案封闭，不再接受新功能了。新的功能将被加入ES7。
|
||||
|
||||
任何人都可以向ES7提案，从提案到变成正式标准，需要经历五个阶段。每个阶段的变动都需要由TC39委员会批准。
|
||||
任何人都可以向TC39提案，从提案到变成正式标准，需要经历五个阶段。每个阶段的变动都需要由TC39委员会批准。
|
||||
|
||||
- Stage 0 - Strawman（展示阶段）
|
||||
- Stage 1 - Proposal（征求意见阶段）
|
||||
@ -435,6 +435,8 @@ fs.writeFileSync('out.js.map', result.sourceMap);
|
||||
- es7.asyncFunctions：async函数
|
||||
- es7.objectRestSpread：对象的Rest参数和扩展运算符
|
||||
|
||||
ECMAScript当前的所有提案，可以在TC39的官方网站[Github.com/tc39/ecma262](https://github.com/tc39/ecma262)查看。
|
||||
|
||||
Babel转码器对Stage 2及以上阶段的功能，是默认支持的。对于那些默认没有打开的功能，需要手动打开。
|
||||
|
||||
```bash
|
||||
|
||||
@ -44,13 +44,13 @@ ES6的模块自动采用严格模式，不管你有没有在模块头部加上`"
|
||||
- 不能使用`fn.caller`和`fn.arguments`获取函数调用的堆栈
|
||||
- 增加了保留字（比如`protected`、`static`和`interface`）
|
||||
|
||||
上面这些限制，模块都必须遵守。
|
||||
上面这些限制，模块都必须遵守。由于严格模式是ES5引入的，不属于ES6，所以请参阅相关ES5书籍，本书不再详细介绍了。
|
||||
|
||||
## export命令
|
||||
|
||||
模块功能主要由两个命令构成：export和import。export命令用于规定模块的对外接口，import命令用于输入其他模块提供的功能。
|
||||
模块功能主要由两个命令构成：`export`和`import`。`export`命令用于规定模块的对外接口，`import`命令用于输入其他模块提供的功能。
|
||||
|
||||
一个模块就是一个独立的文件。该文件内部的所有变量，外部无法获取。如果你希望外部能够读取模块内部的某个变量，就必须使用export关键字输出该变量。下面是一个JS文件，里面使用export命令输出变量。
|
||||
一个模块就是一个独立的文件。该文件内部的所有变量，外部无法获取。如果你希望外部能够读取模块内部的某个变量，就必须使用`export`关键字输出该变量。下面是一个JS文件，里面使用`export`命令输出变量。
|
||||
|
||||
```javascript
|
||||
// profile.js
|
||||
@ -59,7 +59,7 @@ export var lastName = 'Jackson';
|
||||
export var year = 1958;
|
||||
```
|
||||
|
||||
上面代码是profile.js文件，保存了用户信息。ES6将其视为一个模块，里面用export命令对外部输出了三个变量。
|
||||
上面代码是`profile.js`文件，保存了用户信息。ES6将其视为一个模块，里面用export命令对外部输出了三个变量。
|
||||
|
||||
export的写法，除了像上面这样，还有另外一种。
|
||||
|
||||
@ -72,7 +72,7 @@ var year = 1958;
|
||||
export {firstName, lastName, year};
|
||||
```
|
||||
|
||||
上面代码在export命令后面，使用大括号指定所要输出的一组变量。它与前一种写法（直接放置在var语句前）是等价的，但是应该优先考虑使用这种写法。因为这样就可以在脚本尾部，一眼看清楚输出了哪些变量。
|
||||
上面代码在`export`命令后面，使用大括号指定所要输出的一组变量。它与前一种写法（直接放置在var语句前）是等价的，但是应该优先考虑使用这种写法。因为这样就可以在脚本尾部，一眼看清楚输出了哪些变量。
|
||||
|
||||
export命令除了输出变量，还可以输出函数或类（class）。
|
||||
|
||||
|
||||
@ -2,9 +2,9 @@
|
||||
|
||||
## 官方文件
|
||||
|
||||
- [ECMAScript 6 Language Specification](http://people.mozilla.org/~jorendorff/es6-draft.html): 语言规格草案
|
||||
- [harmony:proposals](http://wiki.ecmascript.org/doku.php?id=harmony:proposals): ES6的各种提案
|
||||
- [Draft Specification for ES.next (Ecma-262 Edition 6)](http://wiki.ecmascript.org/doku.php?id=harmony:specification_drafts): ES6草案各版本之间的变动
|
||||
- [ECMAScript® 2015 Language Specification](http://www.ecma-international.org/ecma-262/6.0/index.html): ES6语言规格
|
||||
- [ECMAScript Current Proposals](https://github.com/tc39/ecma262): ECMAScript当前的各种提案
|
||||
- [ECMAScript® 2016 Language Specification](http://tc39.github.io/ecma262/): ECMAScript 2016草案
|
||||
|
||||
## 综合介绍
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user