数组解构对象面试题

let [a, b] = {
  a: 2,
  b: 5
}
console.log("a b", a, b)

通过数组解构的方式，将对象里的内容进行输出打印,其不能改变原代码解构!

当直接运行以上代码的时候，会看到如下结果!

VM58:1 Uncaught TypeError: {(intermediate value)(intermediate value)} is not iterable
    at <anonymous>:1:14

意思是，解构的对象内容是不可迭代的(is not iterable)!

下面看一个能够正常解构的代码!

let [a, b] = [1, 2];
console.log(a, b, [1, 2]) // 1 2

顺便看下，数组对象里的属性 ，其发现Symbol(Symbol.iterator)属性!

const iter = [1,2][Symbol.iterator]();
console.log("iter:", iter.next()) // { value: 1, done: false }
console.log("iter:", iter.next()) // { value: 2, done: false }
console.log("iter:", iter.next()) // { value: undefind, done: true }

返会一个函数，其函数内部返回了一个可迭代器!

通过迭代器对象，调用next函数即可获取数组中的每一项!

数组解构的本质:

let [a, b] = [1, 2];
const iter = [1,2][Symbol.iterator]();
let a = iter.next().value;
let b = iter.next().value;
console.log(a, b, [1, 2]) // 1 2

那么，如和让一个对象，变为一个可迭代对象呢?

Object.prototype[Symbol.iterator] = function (){
   // let arr = [2, 5];
   let arr = Object.values(this); // 获取对象中的所有值 返回一个arr
   return arr[Symbol.iterator]();
}
let [a, b] = {
  a: 2,
  b: 5
}
console.log("a b", a, b)

给对象原型，添加可迭代对象，把数组的迭代对象，返回出去即可!