解构 | wxya（个人网站）

解构

#基础语法

#数组

#对象

#函数参数

#String/Map/Set

#解构原理

解构是ES6提供的语法糖，其实内在是针对可迭代对象的Iterator接口，通过遍历器按顺序获取对应的值进行赋值。这里需要提前懂得ES6的两个概念：

Iterator

可迭代对象

#Iterator概念

Iterator是一种接口，为各种不一样的数据解构提供统一的访问机制。任何数据解构只要有Iterator接口，就能通过遍历操作，依次按顺序处理数据结构内所有成员。ES6中的for of的语法相当于遍历器，会在遍历数据结构时，自动寻找Iterator接口。

Iterator作用：

为各种数据解构提供统一的访问接口

使得数据解构能按次序排列处理

可以使用ES6最新命令 for of进行遍历

#可迭代对象

可迭代对象是Iterator接口的实现。这是ECMAScript 2015的补充，它不是内置或语法，而仅仅是协议。任何遵循该协议点对象都能成为可迭代对象。可迭代对象得有两个协议：可迭代协议和迭代器协议。

可迭代协议：对象必须实现@@iterator方法。即对象或其原型链上必须有一个名叫Symbol.iterator的属性。该属性的值为无参函数，函数返回迭代器协议。

属性	值
`Symbol.iterator`	返回一个对象的无参函数，被返回对象符合迭代器协议。

迭代器协议：定义了标准的方式来产生一个有限或无限序列值。其要求必须实现一个next()方法，该方法返回对象有done(boolean)和value属性。

属性

值

next

返回一个对象的无参函数，被返回对象拥有两个属性：done和valuedone - 如果迭代器已经经过了被迭代序列时为 true。这时 value 可能描述了该迭代器的返回值。如果迭代器可以产生序列中的下一个值，则为 false。这等效于连同 done 属性也不指定。value - 迭代器返回的任何 JavaScript 值。done 为 true 时可省略。

通过以上可知，自定义数据结构，只要拥有Iterator接口，并将其部署到自己的Symbol.iterator属性上，就可以成为可迭代对象，能被for of循环遍历。

#解构语法糖

String、Array、Map、Set等原生数据结构都是可迭代对象，可以通过for of循环遍历它。故可以通过ES6解构语法糖依次获取对应的值。

原生object对象是默认没有部署Iterator接口，即object不是一个可迭代对象。因为遍历时，不知道到底哪个属性先遍历，哪个属性后遍历，需要开发者手动指定。不过object部署Iterator接口没有必要，因为ES6提供了Map数据结构。实际上对象被解构时，会被当作Map进行解构。所以虽然Map和Object很多地方相似，但ES6引入Map、Set对象是有其原因的。

解构