JavaScript对象怎么实现迭代(iterator)功能？

最新推荐文章于 2024-07-04 10:44:51 发布

Learn-anything

最新推荐文章于 2024-07-04 10:44:51 发布

阅读量928

点赞数 1

分类专栏： JavaScript 文章标签： javascript iterator 迭代器遍历

本文链接：https://blog.csdn.net/fanlehai/article/details/122043543

版权

JavaScript 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

一、迭代功能是什么？

可迭代对象，需要具备 Symbol.iterator 和 next 这两个函数，即可用 for...of 进行迭代。譬如：String、Array、TypedArray、Map 和 Set，都是可迭代对象。

var myIterator = {
    next: function() {
        // ...
    },
    [Symbol.iterator]: function() { return this }
}

二、怎么用？

1、转换 class 为迭代对象

<!DOCTYPE html>
<html lang='zh-CN'>

<head>
    <meta charset="utf-8">
    <title>Symbol</title>
    <script>
        class SimpleClass {
            constructor(data) {
                this.data = data
            }

            [Symbol.iterator]() {
                let index = 0;
                return {
                    next: () => {
                        if (index < this.data.length) {
                            return { value: this.data[index++], done: false }
                        } else {
                            return { done: true }
                        }
                    }
                }
            }
        }

        const simple = new SimpleClass([1, 2, 3, 4, 5])

        for (const val of simple) {
            console.log(val)   //'1' '2' '3' '4' '5'
        }

    </script>
</head>

<body>
    <h1>Symbol : 打开 Console 看结果！</h1>
</body>

</html>

2、转换 object 为迭代对象

<!DOCTYPE html>
<html lang='zh-CN'>

<head>
    <meta charset="utf-8">
    <title>Symbol</title>
    <script>
        let SimpleClass = {
            data: [1, 2, 3, 4, 5],
            [Symbol.iterator]() {
                let index = 0;
                return {
                    next: () => {
                        if (index < this.data.length) {
                            return { value: this.data[index++], done: false }
                        } else {
                            return { done: true }
                        }
                    }
                }
            }
        }

        for (const val of SimpleClass) {
            console.log(val)   //'1' '2' '3' '4' '5'
        }

    </script>
</head>

<body>
    <h1>Symbol : 打开 Console 看结果！</h1>
</body>

</html>

三、参考文章

JavaScript对象怎么实现迭代(iterator)功能？

Learn-anything

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript对象怎么实现迭代(iterator)功能？

一、迭代功能是什么？可迭代对象，需要具备 Symbol.iterator 和 next 这两个函数，即可用 for...of 进行迭代。譬如：String、Array、TypedArray、Map 和 Set，都是可迭代对象。var myIterator = { next: function() { // ... }, [Symbol.iterator]: function() { return this }}二、怎么用？1、转换 class
复制链接

扫一扫

专栏目录