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>
相关推荐
黑牛儿几秒前
AI Agent\+PHP实现智能接口限流,避开算力成本陷阱(结合今日AI热点)
开发语言·人工智能·php
XMYX-02 分钟前
15 - Go 泛型(Generics):从入门到实战
开发语言·golang
落魄江湖行3 分钟前
进阶篇五 Nuxt4 部署方案:从开发到生产
前端·vue.js·typescript·nuxt4
AIDF20263 分钟前
守方视角:《开场白博弈:如何通过三分钟建立“高价值”叙事》
面试
Halo_tjn3 分钟前
Java 内部类
java·开发语言·算法
懂懂tty5 分钟前
Rspack简介
前端
开心码农1号6 分钟前
Go关于切边变量本身地址和内部指向地址
前端·算法
碎碎念的安静6 分钟前
WPF 与 Qt 进程间通信(IPC)
开发语言·qt·wpf
一个打工仔的笔记11 分钟前
vue3 elementui plus 可编辑表格 完整例子
前端·vue.js·elementui
IT_陈寒13 分钟前
SpringBoot自动配置把我坑惨了,原来它偷偷干了这么多事
前端·人工智能·后端