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>
相关推荐
kyriewen114 分钟前
代码写成一锅粥?这5种设计模式让你的项目“起死回生”
前端·javascript·设计模式·typescript·ecmascript·html5
lsx2024065 分钟前
Vue3 安装指南
开发语言
ywlovecjy6 分钟前
【Nginx 】Nginx 部署前端 vue 项目
前端·vue.js·nginx
skywalk81636 分钟前
g4f JavaScript调用报错问题解决
开发语言·javascript·ecmascript
Alice-YUE6 分钟前
AI对话为什么需要RAG
前端·语言模型·rag
C澒6 分钟前
IntelliPro 企业级产研协作平台:低代码实时预览与可视化编辑技术调研
前端·低代码·ai编程
霍理迪7 分钟前
TS类型断言和类型守卫
前端
qqty12179 分钟前
基于python语言的网页设计(手把手教你设计一个个人博客网站)
开发语言·python
木斯佳14 分钟前
前端八股文面经大全:京东前端实习一面(2026-04-16)·面经深度解析
前端
耿雨飞15 分钟前
Python 后端开发技术博客专栏 | 第 02 篇 函数式编程与 Python 魔法 -- 闭包、装饰器、高阶函数
开发语言·python·装饰器·高阶函数·闭包