关于JavaScript异步编程学习顺序

简介: 关于JavaScript异步编程学习顺序

前言


前段时间辞职在家,抽空写了几篇关于 ES6+ 中 Promise、Generator、Async 的文章。写完之后,才发现原先并没有很好地理解“异步编程”,事后有点恍然大悟的意思。


正文


个人认为要写好 JavaScript 异步编程,学习顺序如下:


  • 事件循环机制
  • Promise 对象
  • 迭代器 Iterator
  • 生成器 Generator
  • Generator 函数与 Thunk 函数
  • Async/Await 函数


我们都知道 JavaScript 是单线程的,它通过事件循环(Event Loop)机制去实现非阻塞。这属于必须掌握的内容,包括同步任务、异步任务(微任务、宏任务),这是学习其他内容的前提。


在 ES6 之前,通常通过回调函数、事件监听等方式去处理异步操作。当 ES6 标准正式发布之后,提供了全新的 Promise 对象、Generator 函数。

Promise 对象干掉了“地狱回调”(Callback Hell),但容易纵向发展,即一堆的 then()catch() 处理。个人认为 Generator 才是使得 ES6+ 异步编程更强大的功臣。


但在 Generator 之前,应该先要了解 Iterator 迭代器。迭代器是一种机制,是一种接口。为各种不同的数据结构提供了统一的访问机制。迭代器不能完全算是“全新”的东西,只是在 ES6 中被写入标准,并为原有(如数组、字符串)、新增(如Set、Map)的数据结构实现了 Iterator 接口。其实我们很多常用方便的 ES6 语法都是利用迭代器 Iterator 接口实现的。例如 for...of、数组解构、扩展运算符、new Set()Promise.all() 等等。


由于调用 Generator 函数,返回一个生成器对象,该对象本身就是一个可迭代对象(具有 Iterator 接口),也可以利用 for...of 等去遍历它。Generator 函数还是实现自定义迭代器的好方法。


而 Generator 函数的全新而独特的调用机制,才是它强大的原因,所以应该要学会它,并且要了解怎样写一个执行器去自动执行生成器对象。这个才是实际编程中最长用到的。


等你彻底了解 Generator 函数之后,Async 就是小菜一碟,它本质上就是 Generator + Promise + 自定义执行器的组合。

目录
相关文章
|
1月前
|
前端开发 JavaScript 开发者
JavaScript 中的异步编程:Promise 和 Async/Await
在现代的 JavaScript 开发中,异步编程是至关重要的。本文将介绍 JavaScript 中的异步编程概念,重点讨论 Promise 和 Async/Await 这两种常见的处理异步操作的方法。通过本文的阐述,读者将能够更好地理解和应用这些技术,提高自己在 JavaScript 开发中处理异步任务的能力。
|
3天前
|
JavaScript 前端开发
js开发:请解释同步和异步编程的区别。
同步编程按顺序执行,易阻塞;异步编程不阻塞,提高效率。同步适合简单操作,异步适合并发场景。示例展示了JavaScript中同步和异步函数的使用。
14 0
|
3天前
|
JavaScript 前端开发 测试技术
学习JavaScript
【4月更文挑战第23天】学习JavaScript
11 1
|
4天前
|
前端开发 JavaScript 编译器
深入解析JavaScript中的异步编程:Promises与async/await的使用与原理
【4月更文挑战第22天】本文深入解析JavaScript异步编程,重点讨论Promises和async/await。Promises用于管理异步操作,有pending、fulfilled和rejected三种状态。通过.then()和.catch()处理结果,但可能导致回调地狱。async/await是ES2017的语法糖,使异步编程更直观,类似同步代码,通过事件循环和微任务队列实现。两者各有优势,适用于不同场景,能有效提升代码可读性和维护性。
|
11天前
|
JavaScript 前端开发 应用服务中间件
node.js之第一天学习
node.js之第一天学习
|
1月前
|
运维 JavaScript 前端开发
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
发现了一款宝藏学习项目,包含了Web全栈的知识体系,JS、Vue、React知识就靠它了!
|
1月前
|
JavaScript
Vue.js学习详细课程系列--共32节(4 / 6)
Vue.js学习详细课程系列--共32节(4 / 6)
35 0
|
1月前
|
JavaScript 前端开发 UED
解释 JavaScript 中的异步编程和回调函数。
解释 JavaScript 中的异步编程和回调函数。
16 0
|
1月前
|
前端开发 搜索推荐 JavaScript
编程笔记 html5&css&js 001 学习编程从网页开始
编程笔记 html5&css&js 001 学习编程从网页开始
|
2月前
|
前端开发 JavaScript UED
JavaScript中的异步编程和Promise
【2月更文挑战第3天】在Web开发中,JavaScript是一门非常重要的编程语言,而异步编程是JavaScript中的一个关键概念。本文将介绍JavaScript中的异步编程特点,以及如何使用Promise来更加优雅地处理异步操作,帮助开发者更好地理解和应用这一技术。
17 3