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>
相关推荐
csbysj20206 小时前
SOAP Fault 元素
开发语言
Soari6 小时前
Ziggo-CaaS-Switch软件配置: undefined reference to pthread_create
java·开发语言·fpga开发·tsn·zynq·交换机配置
月弦笙音6 小时前
【monorepo架构】前端 pnpm workspace详解
前端
wjs20246 小时前
jEasyUI 树形网格动态加载详解
开发语言
小嘿前端仔6 小时前
React 19 正式发布:这一次,表单和服务器组件终于"原生"了
前端
叫我一声阿雷吧6 小时前
JS 入门通关手册(48):本地存储全解析(localStorage/sessionStorage/cookie,面试高频)
javascript·本地存储·cookie·localstorage·存储方案· 前端面试·essionstorage
xlq223227 小时前
41.线程封装与互斥
linux·开发语言
英俊潇洒美少年7 小时前
前端组件化开发最佳实践 + 高频面试题(Vue & React)
前端·vue.js·react.js
凌览7 小时前
别再手搓 Skill 了,用这个工具 5 分钟搞定
前端·后端
不爱吃炸鸡柳7 小时前
算法复杂度从入门到精通:时间与空间复杂度全解析
开发语言·c++·算法