如何用ES6将不可迭代对象变为可迭代?
发布于 2 年前 作者 zengming 1291 次浏览 来自 分享

CSDN博客主页:https://blog.csdn.net/weixin_53893220?spm=1001.2101.3001.5343

众所周知,在js中的某些类型是内置好的可迭代对象,比如:字符串、数组、类型数组、Map对象等。而Object类型不可迭代。这些内置可迭代对象可以进行迭代的原因是内部实现了@@iterator 方法,即在该对象或该对象的原型链上有Symbol.iterator属性实现了@@iterator 方法。

而在实际开发获取数据中,为了数据的方便读取保存,需要让拥有某个数据结构的对象可迭代,因此本文将讲述如何自定义Symbol.iterator属性实现对象的可迭代化,下面将介绍两种方式:

1.通过可迭代协议,用yield来控制返回值

2.通过迭代器协议,用返回值中的done判断该对象是否迭代完毕,用

value来返回所需值

本篇文章用作例子的对象数据结构如下:

let authors = {
    allAuthors: {
        fiction: ['Agla', 'Skks', 'LP'],
        scienceFiction: ['Neal', 'Arthru', 'Ribert'],
        fantasy: ['J.R.Tole', 'J.M.R', 'Terry P.K']
    },
    Addres: []
}

1.可迭代协议实现

authors[Symbol.iterator] = function*() {
    let allAuthors = this.allAuthors;
    let keys = Reflect.ownKeys(allAuthors);
    let value = [];

    while (1) {
        if (!value.length) {
            if (keys.length) {
                value = allAuthors[keys[0]]
                keys.shift()
                yield value.shift()
            } else {
                return false
            }
        } else {
            yield value.shift()
        }
    }

}

let one = []
for (let key of authors) {
    // console.log(key)
    one.push(key)
}
console.log(one)

2.迭代器实现

authors[Symbol.iterator] = function() {
    let allAuthors = this.allAuthors;
    let keys = Reflect.ownKeys(allAuthors);
    let value = [];

    return {
        next() {
            if (!value.length) {
                if (keys.length) {
                    value = allAuthors[keys[0]];
                    keys.shift();
                }
            }

            return {
                done: !value.length,
                value: value.shift()
            }
        }
    }
}

let one = []
for (let key of authors) {
    // console.log(key)
    one.push(key)
}
console.log(one)

觉得该篇文章有用的请不要忘记忘记点击右下角的大拇指~

1 回复

好像大拇指在左边吧

回到顶部