WEB前端教程：揭开迭代器神秘的面纱 - 好学星城学习论坛

page contents

WEB前端教程：揭开迭代器神秘的面纱

学会给不可迭代对象编写迭代器，让它也变成可迭代对象

课程目标

理解为什么需要迭代器？
了解迭代协议，以及如何使用迭代器，编写迭代器。
学会给不可迭代对象编写迭代器，让它也变成可迭代对象

阅读

为什么需要迭代器

在 ECMAScript较早的版本中，执行迭代必须使用循环或者其他辅助结构，随着代码增加，代码变得混乱难以理解。很多语言通过原生语言结构解决了这个问题，开发者无须实现知道如何迭代就能实现迭代操作。这个解决方案就是迭代器模式,迭代器的主要目标是消除循环的复杂性和容易出错的性质。

接下来我们来看看各个 JavaScript 中各个迭代机制的不足之处

不同的循环构造缺点(opens new window)
JavaScript 迭代器概述 (opens new window)学习 javascript 各个迭代机制的利弊
JavaScript Symbols、Iterators、Generators、Async/Await 和 Async Iterators——所有的解释都很简单(opens new window)

迭代协议

在实现迭代器之前，我们需要学习迭代协议，迭代协议是可迭代对象在实现接口时需要遵循的一组规则。

自定义迭代器

学习了迭代协议，我们就可以编写属于自己的迭代器

任务一

请你练习显示地调用迭代器,给你一个对象数组 foodList 数据。

实现点击下一种食物，就调用迭代器的 next () 方法，得到食物名称和图片，将图片显示在类名为 foodContainer 的 p 标签中

    <button>下一种食物</button>
    <p class="foodContainer"></p>

    let foodList = [
        {chocolate:'

发表于 2022-11-01 14:05
阅读 ( 350 )
分类：WEB前端开发

作家榜 »

轩辕小不懂 2403 文章
小柒 1470 文章
Pack 1135 文章
Nen 576 文章
王昭君 209 文章
文双 71 文章
小威 64 文章
Cara 36 文章