【日常记录】【JS】一道解构面试题-CSDN博客

本文链接：https://blog.csdn.net/qq_45634593/article/details/137559693

文章讲述了如何使JavaScript代码正确执行，通过理解可迭代对象和迭代器协议，修复了初始代码的错误，并利用`Object.values`和原型对象实现正确的输出。作者介绍了如何将对象转化为可迭代并获取其值的过程。

摘要由CSDN通过智能技术生成

文章目录

1、描述

让这一段代码可以执行，并且正确输出

    let [name, age] = {
      name: '呆呆狗',
      age: 20
    }
    console.log(name, age);

2、分析与实现

在浏览器上执行这段代码会报错

在这里插入图片描述

翻译以下：不是可迭代对象

可迭代对象（Iterable）是指实现了可迭代协议（Iterable Protocol）的对象。换句话说，可迭代对象是具有 Symbol.iterator 方法的对象，该方法返回一个迭代器对象。

迭代器是实现了迭代器协议（Iterator Protocol）的对象。根据这个协议，一个对象如果要被视为迭代器，它必须实现一个名为 next 的方法，该方法每次被调用都会返回一个包含 value 和 done 属性的对象。其中，value 表示迭代器返回的值，而 done 表示迭代器是否已经完成遍历。

    let [name, age] = {
      name: '呆呆狗',
      age: 20,
      [Symbol.iterator]: function () {
        return {
          next() {
            return {
              value: 1,
              done: false
            }

          }
        }
      }
    }
    console.log(name, age);

在这里插入图片描述

这样就没报错了，但是值不对，可以借助 原型对象 ,Object.values(obj) 返回值是一个数组，数组默认就实现了可迭代协议

    Object.prototype[Symbol.iterator] = function () {
      // 把这个对象转化成数组，拿到他的Symbol.iterator 属性，
      // 又因为 可迭代协议，所以返回的是一个迭代器 ，所以需要手动调用以下
      return Object.values(this)[Symbol.iterator]()
    }
    let [name, age] = {
      name: '呆呆狗',
      age: 20,

    }
    console.log(name, age);