@@ -217,29 +217,22 @@ foo // error: foo is not defined
217217
218218上面代码中,` foo ` 是匹配的模式,` baz ` 才是变量。真正被赋值的是变量` baz ` ,而不是模式` foo ` 。
219219
220- 注意,采用这种写法时,变量的声明和赋值是一体的。对于 ` let ` 和 ` const ` 来说,变量不能重新声明,所以一旦赋值的变量以前声明过,就会报错 。
220+ 与数组一样,解构也可以用于嵌套结构的对象 。
221221
222222``` javascript
223- let foo;
224- let {foo} = {foo: 1 }; // SyntaxError: Duplicate declaration "foo"
225-
226- let baz;
227- let {bar: baz} = {bar: 1 }; // SyntaxError: Duplicate declaration "baz"
228- ```
229-
230- 上面代码中,解构赋值的变量都会重新声明,所以报错了。不过,因为` var ` 命令允许重新声明,所以这个错误只会在使用` let ` 和` const ` 命令时出现。如果没有第二个` let ` 命令,上面的代码就不会报错。
231-
232- ``` javascript
233- let foo;
234- ({foo} = {foo: 1 }); // 成功
223+ let obj = {
224+ p: [
225+ ' Hello' ,
226+ { y: ' World' }
227+ ]
228+ };
235229
236- let baz;
237- ({bar: baz} = {bar: 1 }); // 成功
230+ let { p: [x, { y }] } = obj;
231+ x // "Hello"
232+ y // "World"
238233```
239234
240- 上面代码中,` let ` 命令下面一行的圆括号是必须的,否则会报错。因为解析器会将起首的大括号,理解成一个代码块,而不是赋值语句。
241-
242- 和数组一样,解构也可以用于嵌套结构的对象。
235+ 注意,这时` p ` 是模式,不是变量,因此不会被赋值。如果` p ` 也要作为变量赋值,可以写成下面这样。
243236
244237``` javascript
245238let obj = {
@@ -249,12 +242,13 @@ let obj = {
249242 ]
250243};
251244
252- let { p: [x, { y }] } = obj;
245+ let { p, p : [x, { y }] } = obj;
253246x // "Hello"
254247y // "World"
248+ p // ["Hello", {y: "World"}]
255249```
256250
257- 注意,这时 ` p ` 是模式,不是变量,因此不会被赋值 。
251+ 下面是另一个例子 。
258252
259253``` javascript
260254var node = {
@@ -266,13 +260,13 @@ var node = {
266260 }
267261};
268262
269- var { loc: { start: { line }} } = node;
263+ var { loc, loc : { start }, loc : { start: { line }} } = node;
270264line // 1
271- loc // error: loc is undefined
272- start // error: start is undefined
265+ loc // Object {start: Object}
266+ start // Object {line: 1, column: 5}
273267```
274268
275- 上面代码中, 只有` line ` 是变量,` loc ` 和` start ` 都是模式,不会被赋值 。
269+ 上面代码有三次解构赋值,分别是对 ` loc ` 、 ` start ` 、 ` line ` 三个属性的解构赋值。注意,最后一次对 ` line ` 属性的解构赋值之中, 只有` line ` 是变量,` loc ` 和` start ` 都是模式,不是变量 。
276270
277271下面是嵌套赋值的例子。
278272
@@ -296,10 +290,10 @@ var {x, y = 5} = {x: 1};
296290x // 1
297291y // 5
298292
299- var {x: y = 3 } = {};
293+ var {x: y = 3 } = {};
300294y // 3
301295
302- var {x: y = 3 } = {x: 5 };
296+ var {x: y = 3 } = {x: 5 };
303297y // 5
304298
305299var { message: msg = ' Something went wrong' } = {};
@@ -358,7 +352,7 @@ let x;
358352
359353上面代码将整个解构赋值语句,放在一个圆括号里面,就可以正确执行。关于圆括号与解构赋值的关系,参见下文。
360354
361- 解构赋值允许,等号左边的模式之中 ,不放置任何变量名。因此,可以写出非常古怪的赋值表达式。
355+ 解构赋值允许等号左边的模式之中 ,不放置任何变量名。因此,可以写出非常古怪的赋值表达式。
362356
363357``` javascript
364358({} = [true , false ]);
0 commit comments