ES6 迭代器(Iterator)

目录

迭代器概念:

迭代器与 for...of

迭代器工作原理:

利用迭代器自定义遍历数据


迭代器概念:

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

迭代器与 for...of

        1) ES6 创造了一种新的遍历命令 for...if 循环,Iterator 接口主要提供 for...of 消费

        2) 原生具备 iterator 接口的数据(可用 for of 遍历)

                a)Array

                b)Arguments

                c)Set

                d)Map

                e)String

                f)TypedArray

                g)NodeList

迭代器工作原理:

        1.创建一个指针对象,指向当前数据结构的起始位置

        2.第一次调用对象的 next 方法,指针自动指向数据结构的第一个成员

        3.接下来不断调用 next 方法,指针一直往后移动,直到指向最后一个成员

        4.每次调用 next 方法会返回一个包含 value 和 done 属性的对象

        注意:需要自定义遍历数据的时候,要想到迭代器

利用迭代器自定义遍历数据

代码展示:

     <script>
        let team = {
            name: '终极一班',
            status: [
                'xiaoming',
                'xiaoning',
                'xiaotian',
                'knight'
            ],

            [Symbol.iterator]() {
                // 索引变量
                let index = 0
                return {
                    next: () => {
                        if (index < this.status.length) {
                            let res =  {value: this.status[index], done: false}
                            index++
                            return res
                        } else {
                            return {value: undefined, done: true}
                        }
                        
                    }
                }
            }
        }

        for(let v of team) {
            console.log(v)
        }
    </script>

遍历结果:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值