【ES】笔记-迭代器

迭代器概念

迭代器(Iterator)是一种接口,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口,就可以完成遍历操作。

  1. ES6 创造了一种新的遍历命令for...of循环,Iterator接口主要供for...of消费
  2. 原生具备iterator接口的数据(可用for of 遍历)
    a) Array
    b) Arguments
    c) Set
    d) Map
    e) String
    f) TypedArray
    g) NodeList
  3. 工作原理
    a) 创建一个指针对象,指向当前数据结构的起始位置
    b) 第一次调用对象的next方法,指针自动指向数据结构的第一个成员
    c) 接下来不断调用next方法,指针一直往后移动,直到指向最后一个成员
    d) 每调用next方法返回一个包含value和done属性的对象
    注: 需要自定义遍历数据的时候,要想到迭代器。

数组迭代

javascript 复制代码
    <script>
        //声明一个数组
        const xiyou=['唐僧','孙悟空','猪八戒','沙僧'];

        //使用for.. of 遍历数组
        for(let v of xiyou){
            console.log(v)
        } 

        let iterator=xiyou[Symbol.iterator]();

        //调用对象的next方法
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());
        console.log(iterator.next());

    </script>

非原生数据对象的自定义实现

javascript 复制代码
    <script>
        //声明一个对象
        const banji = {
            name: "终极一班",
            stus: [
                'xiaoming',
                'xiaoning',
                'xiaotian',
                'knight'
            ],
            [Symbol.iterator]() {
                //索引变量
                let index = 0;
                // 保存this
                let _this = this;
                return {
                    next: function () {  //也可以采用箭头函数,就不需要外层保存this
                        if (index < _this.stus.length) {
                            const result = { value: _this.stus[index], done: false };
                            //下标自增
                            index++;
                            //返回结果
                            return result;
                        }else{
                            return {value: undefined, done: true};
                        }
                    }
                };
            }
        }

        //遍历这个对象 
        for (let v of banji) {
            console.log(v);
        }
    </script>
相关推荐
吴梓穆11 小时前
UE5学习笔记 FPS游戏制作38 继承标准UI
笔记·学习·ue5
V---scwantop---信12 小时前
英文字体:大胆都市街头Y2Y涂鸦风格品牌海报专辑封面服装字体 Chrome TM – Graffiti Font
笔记·字体
Moonnnn.12 小时前
运算放大器(四)滤波电路(滤波器)
笔记·学习·硬件工程
吴梓穆12 小时前
UE5学习笔记 FPS游戏制作37 蓝图函数库 自己定义公共方法
笔记·学习·ue5
吴梓穆13 小时前
UE5学习笔记 FPS游戏制作41 世界模式显示UI
笔记·学习·ue5
s_little_monster13 小时前
【Linux】进程信号的捕捉处理
linux·运维·服务器·经验分享·笔记·学习·学习方法
RedMery14 小时前
论文阅读笔记:Denoising Diffusion Implicit Models (4)
论文阅读·笔记
go_bai14 小时前
Linux环境基础开发工具——(2)vim
linux·开发语言·经验分享·笔记·vim·学习方法
吴梓穆14 小时前
UE5学习笔记 FPS游戏制作35 使用.csv配置文件
笔记·学习·ue5
100分题库小程序15 小时前
2025年机动车授权签字人考试判断题分享
经验分享·笔记