JS详解-迭代器模式详解两种方法实现

前言:

javascript 复制代码
        // 迭代协议可以定制对象的迭代行为-分为两个协议:可迭代协议、迭代器协议
        // 可迭代协议:增加方法[Symbol,=.iterator](){}(属性名表达式)返回符合协议器的对象
        // 迭代器协议:有next方法的对象,next方法返回:
        // 已结束:{done:true}
        // 继续迭代:{done:false,value:'x'}
        // 可以使用Generator或自己实现对象,next

Generator法:

javascript 复制代码
   <script>
        const obj = {
            // Symbol.iterator 内置常量
            //[属性名表达式](){}
            [Symbol.iterator](){
               // 手写
               const arr = [1,2,3,4,5]
                let index = 0
                return {
                    next(){
                        if(index < arr.length){
                            // 可以继续迭代
                            return {
                                done:false,
                                value:arr[index++]
                            }
                        }else{
                            return {
                                // 已结束
                                done:true
                            }
                        }
                    }
                }
            }
        }
        for(const iterator of obj){
            console.log('iterator',iterator)
        }
    </script>

手写使用next和对象:

javascript 复制代码
   <script>
        const obj = {
            // Symbol.iterator 内置常量
            //[属性名表达式](){}
            [Symbol.iterator](){
                // 使用Generator
                function* gen(){
                    yield 1
                    yield 2
                    yield 3
                    yield 4
                    yield 5
                }
                return gen()
            }
        }
        for(const iterator of obj){
            console.log('iterator',iterator)
        }
    </script>
相关推荐
Slice_cy15 小时前
Mint 自研框架设计与实现:从重复开发走向配置驱动(二)
前端·后端·架构
greenbbLV15 小时前
积分兑换商城供应商挑选:避坑要点与靠谱选择解析
前端·小程序
醉城夜风~15 小时前
C++模板详解:从基础到高级全面解析
java·开发语言·c++
张元清15 小时前
React useDropZone Hook:搭建一个文件拖放区(2026)
javascript·react.js
地球驾驶员15 小时前
NX二次开发C#-获取体的外表面
开发语言·c#
a11177615 小时前
3D 建筑编辑器 Pascal Editor THreeJS 开源
前端·3d·html
jason_yang15 小时前
写给女儿的英语App
前端·人工智能
誰能久伴不乏15 小时前
深入理解 C++ 多态:对象模型与底层机制解析
开发语言·c++·架构
思码梁田15 小时前
CSS 定位详解:从相对到固定,掌握网页布局的核心
前端·javascript·css
ShineWinsu15 小时前
对于Linux:自定义协议(基于TCP)实现网络计算器的解析
linux·网络·c++·网络协议·tcp/ip·面试·网络计算器