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>
相关推荐
Heo13 小时前
大厂前端调试不能只会debugger
前端·javascript·面试
汉字萌萌哒13 小时前
2019CCF-CSP入门级C++试题解析
java·开发语言·c++
用户21816970493013 小时前
Flutter (十七) 网络请求
前端
cidy_9813 小时前
React 19 + Vite 企业级前端项目:从零搭建到规范交付
前端
用户9210802628613 小时前
如何把一张图片做成自定义复杂 UI 图标
前端
叠层归一研究院13 小时前
AGI 系统(十一):二阶网络 — 二阶递归 × 多主体 (元符号网络)
开发语言·人工智能·算法·php·agi
用户9385156350714 小时前
从 0 拆解一个 Next.js 笔记系统:npx、App Router、RSC 与组件规划全记录
前端·后端·全栈
小雨笙笙14 小时前
C语言:变量三属性——存储类型
c语言·开发语言
城管不管14 小时前
重生——第九次面试2026.8.13某车一面
分布式·ai·面试·职场和发展·rabbitmq
GitLqr14 小时前
玩转 Flutter 中的 Stack 与 Positioned:解决 UI 重叠问题的实战指南
flutter·面试·全栈