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>
相关推荐
怕浪猫8 小时前
第一章、Chrome DevTools Protocol (CDP) 详解
前端·javascript·chrome
小小编程路8 小时前
C++ 异常 完整讲解
开发语言·c++
kyriewen8 小时前
从本地到生产:迁移到 GitHub Actions 自动化 CI/CD,总结了这 5 个坑
前端·github·自动化运维
雨季mo浅忆8 小时前
首个Vue3项目边写边学边记
前端·vue3
AI科技星8 小时前
数术工坊 · 第四卷 橡皮泥江湖(拓扑学)【完整定稿】
c语言·开发语言·汇编·electron·概率论·拓扑学
张忠琳9 小时前
【Go 1.26.4】Golang Select 深度解析
开发语言·后端·golang
IT_陈寒9 小时前
React中useEffect依赖项这个坑我居然踩了三天
前端·人工智能·后端
qq4356947019 小时前
Vue04
前端·vue.js
AC赳赳老秦10 小时前
OpenClaw+Power Apps 实战:自动生成 Power Apps 应用、连接 Excel 数据源
大数据·开发语言·python·serverless·excel·deepseek·openclaw
提笔了无痕10 小时前
如何用Go实现整套RAG流程
开发语言·后端·golang