小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。

本文同时参与 「掘力星计划」       ，赢取创作大礼包，挑战创作激励金

数组解构

曾经访问数组中值的方法

const arr = [1,2,3]
const foo = arr[0]
const bar = arr[1]
const biz = arr[2]

有了解构之后

我们可以这样访问

const arr = [1,2,3]
const [foo, bar, biz] = [1,2,3]

当然我们还能这样

如果想要访问 第二位

const [, bar, ] = [1,2,3]
console.log(var) // 2

如果想要访问 第三位

const [, , biz] = [1,2,3]
console.log(biz) // 3

如果想要访问 第一位 和 之后 的剩余值

const [foo, ...rest] = [1,2,3]
console.log(foo) // 1
console.log(rest) // [2,3]

超出访问值

const [foo, bar, biz, more] = [1,2,3]
console.log(more) // undefined

当然还可以设置默认值

const [foo, bar, biz, more = 'default more'] = [1,2,3]
console.log(more) // default more

对象解构

对象解构就不能像数组解构这样操作了，那该怎么使用呢？

使用

例如：

const obj = { name: 'name' }
const { name } = obj
console.log( name ) // name

当然，有一个问题就很让人头痛了，如果我先初始了一个常量 name 该怎么进行解构呢？

const obj = { name: 'name' }
const name = 'tom'
// 变量重命名
const { name: objName } = obj
console.log( name ) // tom
console.log( objName ) // name

剩余的其他的用法就和数组差不多，这里也就不做一一的介绍了

总结

活用解构可以让代码更加的简洁，避免了一些多次声明的情况，对开发乃至之后的维护都是有不小的帮助，如何用更少的代码做更多的事情是我们应该追求的！