基础学习: 以数组方式解构对象，一行代码的有趣题目/ 渡一

一个有趣的题目
更新于: 2023-09-13 11:25:18

题目

在网上看到的，很有用的题目，考察了很多的基础知识

让下面的代码运行不出错: 
const [a, b] = {a: 1, b: 2}

分析

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

如何让对象 iterable

let range = {
  from: 1,
  to: 5
};

// 1. for..of 调用首先会调用这个：
range[Symbol.iterator] = function() {

  // ……它返回迭代器对象（iterator object）：
  // 2. 接下来，for..of 仅与下面的迭代器对象一起工作，要求它提供下一个值
  return {
    current: this.from,
    last: this.to,

    // 3. next() 在 for..of 的每一轮循环迭代中被调用
    next() {
      // 4. 它将会返回 {done:.., value :...} 格式的对象
      if (this.current <= this.last) {
        return { done: false, value: this.current++ };
      } else {
        return { done: true };
      }
    }
  };
};

// 现在它可以运行了！
for (let num of range) {
  alert(num); // 1, 然后是 2, 3, 4, 5
}

数组

了解一下数组的另一种取值方式，可以通过 for — of 来完成

const arr = [1,2,3];
const iter = arr[Symbol.iterator]();
console.log(iter.next());

// 结果如下: 
{ value: 1, done: false }
{ value: 2, done: false }
{ value: 3, done: false }
{ value: undefined, done: true }

解题1

直接使用 generator 函数

Object.prototype[Symbol.iterator] = function* () {
  for (let key in this) {
    yield this[key]
  }
}

const [a, b] = {a: 1, b: 2}
console.log(a,b);

es5版本

Object.prototype[Symbol.iterator] = function () {
  return Object.values(this)[Symbol.iterator]();
}

const [a, b] = {a: 1, b: 2};
console.log(a,b);

另一个变种

// 给js对象添加迭代器，让对象也可以使用 for...of
var obj = { a: 1, b: 2 };

for(let v of obj){
  console.log(v, obj);
}

实现1

使用 generator + yield

var obj = { a: 1, b: 2 };

Object.prototype[Symbol.iterator] = function* () {
    for (let key in this) {
        yield [key, this[key]];
    }
}

for (let [key, value] of obj) {
    console.log(key, value);
}

实现2

var obj = { a: 1, b: 2 };

Object.prototype[Symbol.iterator] = function() {
  const keyIterator = Object.keys(this)[Symbol.iterator]();
  const obj = this;
  return {
    next() {
      const key = keyIterator.next().value;
      return {
        value: [key, obj[key]],
        done: key === undefined
      };
    }
  };
};


for (let [key, value] of obj) {
    console.log(key, value);
}

参考