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>
相关推荐
Highcharts.js7 小时前
BI可视化图表“维护难”问题的解决方案
开发语言·前端·javascript·编辑器·ecmascript·bi·highcharts
广州华水科技7 小时前
单北斗GNSS在建筑形变监测中的应用与优势分析
前端
hunter_0767 小时前
Swift、Objective-C++ 与 Flutter 如何调用 C++:从混编接入到内存安全
前端
Java后端的Ai之路7 小时前
前端技术Vue-13-安装webpack与vuejs
前端·vue.js·webpack
倚窗听花_7 小时前
IIS部署前端Vue项目
前端·javascript·vue.js
yixun_gdas7 小时前
政企网站错敏巡查:错敏都藏在哪些位置?
开发语言·前端·javascript·内容运营
小羊没烦恼!7 小时前
.NET 11 Runtime Async 详解
java·运维·开发语言·javascript·python
Дерек的学习记录7 小时前
Unreal Engine 5:开关门实现和流程控制
开发语言·学习·ue5
哇嘎呀8 小时前
RHCSA题目
java·服务器·前端
周厉8 小时前
ERP系统全景解析:核心模块与业务逻辑框架
java·服务器·前端