ES6之解构

解构的意思:

结构分解,ES6 中允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构

开发中比较常见的有对象解构、 数组解构、混合解构。这是一种将数据结构分解为更小的部分的过程,从而达到简化提取信息的目的。

1. 数组中的解构

let [a,b,c] = ['我是a', '我是b', '我是c']
 console.log(a)  // 我是a
 console.log(b)  // 我是b
 console.log(c)  // 我是c

2.对象的解构

let { name, age } = { name: 'slz', age: 19}
console.log(name) // slz
console.log(age)  // 19

数组的结构用[];对象的解构用{};一定要区分它是数组还是对象;

区分方法:看它是在赋值还是在拿值,等号左边,都为解构,等号右边,都是数组或者对象。

3. ...运算符

let [a,b,...c] = ['我是a', '我是b', '我是c', '我是多余的吗1', '我是多余的吗2']
console.log(a)
console.log(b)
console.log(c)

...运算符必须出现在尾巴(即最后),叫做 rest 运算符,俗称“尾巴”解构;

  函数的形参列表也能使用 ... 运算符

checkInfo(...arr) {
  for (var i = 0;i<arr.length;i++) {
    let sum = 0;
    sum+=arr[i]
    console.log(sum)
  }
}
this.checkInfo(2,3,4)

此时这个函数即为计算所有实参的和,原来使用的arguments,也被代替。

let obj = { 'a': 1, 'b': 2};
let { a: n, b: m } = obj;
console.log(n)  // 1
console.log(m)  // 2
console.log(a)  // a is not defined
console.log(b)  // b is not defined

冒号右边的变量被是被真正赋值的,冒号左边的变量是表示的是对象的属性;

通常用来从对象中取一个属性,但要给此属性改名

 

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页