06 Web全栈 ES6规范(可迭代协议和迭代器协议)

这篇具有很好参考价值的文章主要介绍了06 Web全栈 ES6规范(可迭代协议和迭代器协议)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

Iterator 和for…of循环

迭代器协议
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols

可迭代协议和迭代器协议

// 迭代器协议 有next函数 返回done value
var isHomeYou = {
	cursor: 0,
	next () {
		const actions = ['douyin', 'chifan', 'shuijiao']
		if (this.cursor > 2) {
			return {
				done: true
			}
		}
		return {
			done: false,
			value: actions[this.cursor++]
		}
	},
	// 可迭代协议
	[Symbol.iterator]() {
   	 	return this;
  	},
}

为什么要有两个协议
不可能知道一个特定的对象是否实现了迭代器协议,然而创造一个同事满足迭代器协议和可迭代协议的对象是很容易的。这样就允许一个迭代器能被不同希望迭代的语法方式所使用。因此,很少只实现迭代器协议而不实现可迭代协议。

都有哪些语法或特征,使用或实现了可迭代协议与迭代器协议
for…of / … / Array.from 使用了迭代器协议
[] / Set / Map / generator 实现了Iterators

Generator函数与异步应用

Generator函数返回的是实现了可迭代协议与迭代器协议的对象
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Generator

function* generator() {
  yield 1;
  yield 2;
  yield 3;
}

const gen = generator(); // "Generator { }"

console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3

// next传递参数

async

async 函数是使用async关键字声明的函数。async 函数是 AsyncFunction 构造函数的实例,并且其中允许使用 await 关键字。async 和 await 关键字让我们可以用一种更简洁的方式写出基于 Promise 的异步行为,而无需刻意地链式调用 promise。
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_function文章来源地址https://www.toymoban.com/news/detail-515068.html

function resolveAfter2Seconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  const result = await resolveAfter2Seconds();
  console.log(result);
  // Expected output: "resolved"
}

asyncCall();

到了这里,关于06 Web全栈 ES6规范(可迭代协议和迭代器协议)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 〖Web全栈开发③〗—HTTP协议和静态web服务器

    🏘️🏘️个人简介:以山河作礼。 🎖️🎖️: Python领域新星创作者,CSDN实力新星认证,阿里云社区专家博主 🎁🎁:Web全栈开发专栏:《Web全栈开发》免费专栏,欢迎阅读! TCP (Transmission Control Protocol) 是在互联网协议(IP)上的一种基于连接(面向连接)的传输层协议 。数据

    2024年02月05日
    浏览(42)
  • <Java Iterator> 迭代器Iterator双层循环

    案例分享: 测试输出:

    2024年02月15日
    浏览(42)
  • <Java Iterator> 迭代器Iterator双层循环 案例分享

    需求: 需要一个按钮,每次执行的时候,调接口刷新数据库表中的数据: 刷新条件: 如果接口获取的数据和数据库表的数据完全一致则不刷新,如果不一致,则新增数据;

    2024年02月15日
    浏览(84)
  • 前端框架学习-ES6新特性(尚硅谷web笔记)

    ECMASript 是由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言。javaScript也是该规范的一种实现。 笔记出处:b站 尚硅谷Web前端ES6教程,涵盖ES6-ES11 阮一峰大佬的:ECMAScript 6 入门 ES6 let 使用let声明变量的特点: 不允许重复声 块儿级别作用域 不存在变量提升 不影

    2024年02月12日
    浏览(34)
  • C++迭代器(STL迭代器)iterator详解

    要访问顺序容器和关联容器中的元素,需要通过“迭代器(iterator)”进行。迭代器是一个变量,相当于容器和操纵容器的算法之间的中介。迭代器可以指向容器中的某个元素,通过迭代器就可以读写它指向的元素。从这一点上看,迭代器和指针类似。 迭代器按照定义方式分

    2024年02月03日
    浏览(45)
  • JS - iterator(迭代器)

    一、 概念        JavaScript原有表示“集合”的数据结构,主要是数组(\\\' Array \\\')和对象(\\\' Object \\\' ),ES6又添加了Map和Set。这样就有了四种数据集合,用户还可以组合使用它们,定义自己的数据结构,比如数组的成员是Map,Map的成员是对象。这样就需要一种统一的接口机制,

    2024年02月07日
    浏览(46)
  • 迭代器 Iterator

    迭代器是一种设计模式,它用于遍历集合或容器中的元素,能够访问集合的元素而无需关心集合的内部结构: 特点: 封装集合访问 :迭代器封装了对集合元素的访问,通过迭代器访问集合中的元素,而无需了解集合的内部结构或实现方式。 统一接口 :迭代器提供了一致的

    2024年02月08日
    浏览(44)
  • Python迭代器(Iterator)

    迭代是访问集合元素的一种方式 迭代器是一个可以记住遍历位置的对象。迭代器对象从第一个元素开始访问,直到所有的元素被访问结束。迭代器只能往前不会后退。 能用for循环遍历的对象 for循环的过程可以通过上面的iter()和next()函数来实现,即: 1、先调用iter(),将nums当

    2024年02月15日
    浏览(37)
  • 迭代器模式(Iterator Pattern)

    一、定义 提供一种方法顺序访问一个聚合对象中各个元素,而又不需要暴露该对象的内部表示。 二、优缺点 优点:  1、它支持以不同的方式遍历一个聚合对象。 2、迭代器简化了聚合类。 3、在同一个聚合上可以有多个遍历。 4、在迭代器模式中,增加新的聚合类和迭代器类

    2024年02月09日
    浏览(43)
  • 【web前端学习】7个ES6解构技巧让代码更简洁

    各位前端er,代码打久了,是否厌倦了编写臃肿且难以阅读的代码?想要提升编码技能并使代码更具可读性和简洁性? 今天这篇文章,与小千一起深入学习 ES6 解构的世界,向您展示如何使用它来编写更干净、更高效的代码 本文将从 解构对象和数组到使用默认值和展开运算符

    2024年02月05日
    浏览(31)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包