JavaScript 迭代器

在JavaScript中,迭代器是一种允许我们遍历集合中元素的对象。迭代器对象具有一个next()方法,该方法返回valuedonevalue是当前迭代的值,done属性是一个布尔值,表示是否到达了集合的末尾。

迭代器协议

一个迭代器对象必须具备以下特性:

  1. next()方法:每次调用返回一个对象,其结构为{value:...,done:...}。如果迭代完成,value可能是任意值,done则为true
  2. 可选的return()方法:允许提前终止迭代,其可选地返回一个值。
  3. 可选的throw()方法:允许在迭代过程中抛出错误。

创建迭代器

使用Symbol.iterator来实现迭代器。

js 复制代码
const myArray = ['a', 'b', 'c']
const myIterator = {
    data: myArray,
    index: 0,

    [Symbol.iterator] () {
        return this
    },

    next () {
        if (this.index < this.data.length) {
            return { value: this.data[this.index++], done: false }
        } else {
            return { done: true }
        }
    }
}

for (let item of myIterator) {
    console.log('🚀 ~ item:', item)
}

生成器函数

生成器函数是实现迭代器的一种更简便的方式。生成器函数使用function*语法定义,并且可以使用yield关键字来产生一系列值。当生成器函数被调用时,它返回一个迭代器对象,该对象可以使用next()方法来迭代。

js 复制代码
function* numberGenerator(max) {
  for (let i = 0; i < max; i++) {
    yield i
  }
}

const gen = numberGenerator(5)

console.log(gen.next()) // { value: 0, done: false }
console.log(gen.next()) // { value: 1, done: false }
console.log(gen.next()) // { value: 2, done: false }
console.log(gen.next()) // { value: 3, done: false }
console.log(gen.next()) // { value: 4, done: false }
console.log(gen.next()) // { value: undefined, done: true }
相关推荐
IT_陈寒37 分钟前
React状态更新那点事儿,我掉坑里爬了半天
前端·人工智能·后端
cwxcc41 分钟前
Google Core Web Vitals(核心网页指标)
前端·性能优化
|晴 天|1 小时前
Vue 3 + LocalStorage 实现博客游戏化系统:成就墙、每日签到、积分商城
前端·vue.js·游戏
逾明2 小时前
Claude Code及Codex的MCP安装和Mastergo MCP的使用
前端·mcp
LovroMance2 小时前
如何进行组件封装
前端
難釋懷2 小时前
Redis服务器端优化-慢查询优化
前端·redis·bootstrap
sghuter2 小时前
Chrome如何重塑Web标准未来
前端·chrome
渣渣xiong2 小时前
从零开始:前端转型AI agent直到就业第十四天-第十七天
前端·人工智能
changshuaihua0012 小时前
React 入门
前端·javascript·react.js
兰为鹏2 小时前
做前端需求总结出的非常好用的skill
前端