ES6 变量解构用法

2018-06-24 00:59:06来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

1、数组解构,可以设置默认值

'use strict';
let [x, y = 'b'] = ['a'];
//控制台输出b
console.log(y);

 

2、对象解构

'use strict';
let { foo, bar } = { foo: "aaa", bar: "bbb" };
// 控制台输出aaa
console.log(foo);
// 控制台输出bbb
console.log(bar);

对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。

对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。

 

3、字符串的解构

'use strict';
let [a,b,c] = 'mfg';
// 控制台输出m
console.log(a);
// 控制台输出f
console.log(b);

 

4、函数参数解构

'use strict';
function add([x, y]){
  return x + y;
}
console.log(add([1, 2]));

 

5、解构的用途

(1)从函数返回多个值

'use strict';
function example() {
  return [1, 2, 3];
}
let [a, b, c] = example();
//控制台输出1
console.log(a)

(2)提取 JSON 数据

'use strict';
let jsonData = {
  id: 42,
  status: "OK",
  data: [867, 5309]
};

let { id, status, data: number } = jsonData;

console.log(id, status, number);

 

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:关于解决微信图文防盗链方案

下一篇:【前端工具】Chrome 扩展程序的开发与发布 -- 手把手教你开发扩