JS常用的几种异步流程控制
栏目: JavaScript · 发布时间: 5年前
内容简介:JavaScript引擎是基于单线程 (Single-threaded) 事件循环的概念构建的,同一时刻只允许一个代码块在执行,所以需要跟踪即将运行的代码,那些代码被放在一个任务队列 (job queue) 中,每当一段代码准备执行时,都会被添加到任务队列中。每当JavaScript引擎中的一段代码结束执行,时间循环 (event loop) 会执行队列中的下一个任务,它是 JavaScript 引擎中的一段程序,负责监控代码执行并管理任务队列。请记住,队列中的任务会从第一个一直执行到最后一个。JavaSc
JavaScript引擎是基于单线程 (Single-threaded) 事件循环的概念构建的,同一时刻只允许一个代码块在执行,所以需要跟踪即将运行的代码,那些代码被放在一个任务队列 (job queue) 中,每当一段代码准备执行时,都会被添加到任务队列中。每当JavaScript引擎中的一段代码结束执行,时间循环 (event loop) 会执行队列中的下一个任务,它是 JavaScript 引擎中的一段程序,负责监控代码执行并管理任务队列。
请记住,队列中的任务会从第一个一直执行到最后一个。
事件模型
JavaScript最基础的异步编程形式(比如点击事件、键盘事件)
直到事件触发时才执行处理程序
回调模式
回调模式与事件模型类似,异步代码都会在未来的某个时间点执行,而这的区别是回调模式中被调用的函数是作为参数传入的。
Node.js读取磁盘上的文件:
readFile('example.txt', function(err, contents) { if(err) { throw err } console.log(contents) }) console.log('Hi!')
调用readFile函数后,console.log('Hi!')语句会立即执行,当readFile结束执行的时候,会向任务队列的末尾添加一个新任务,该任务包含回调函数及相应的参数。
虽然这个模式运行效果很不错,但是如果嵌套了太多的回调函数,就会陷入回调地狱。
当需要跟踪多个回调函数的时候,回调函数的局限性就体现出来了,Promise非常好的改进了这些情况。
Promise
Promise 对象是一个代理对象(代理一个值),被代理的值在Promise对象创建时可能是未知的。它允许你为异步操作的成功和失败分别绑定相应的处理方法(handlers)。 这让异步方法可以像同步方法那样返回值,但并不是立即返回最终执行结果,而是一个能代表未来出现的结果的promise对象
一个 Promise有以下几种状态:
pending: 初始状态,既不是成功,也不是失败状态。 fulfilled: 意味着操作成功完成。 rejected: 意味着操作失败。
pending 状态的 Promise 对象可能触发fulfilled 状态并传递一个值给相应的状态处理方法,也可能触发失败状态(rejected)并传递失败信息。当其中任一种情况出现时,Promise 对象的 then 方法绑定的处理方法(handlers )就会被调用(then方法包含两个参数:onfulfilled 和 onrejected,它们都是 Function 类型。当Promise状态为fulfilled时,调用 then 的 onfulfilled 方法,当Promise状态为rejected时,调用 then 的 onrejected 方法, 所以在异步操作的完成和绑定处理方法之间不存在竞争)。
因为 Promise.prototype.then 和 Promise.prototype.catch 方法返回promise 对象, 所以它们可以被链式调用。
var promise1 = new Promise(function(resolve, reject) { setTimeout(function() { resolve('foo'); }, 300); }); promise1.then(function(value) { console.log(value); // expected output: "foo" }); console.log(promise1); // expected output: [object Promise]
async/await
当调用一个 async 函数时,会返回一个 Promise 对象。当这个 async 函数返回一个值时,Promise 的 resolve 方法会负责传递这个值;当 async 函数抛出异常时,Promise 的 reject 方法也会传递这个异常值。
async 函数中可能会有 await 表达式,这会使 async 函数暂停执行,等待 Promise 的结果出来,然后恢复async函数的执行并返回解析值(resolved)。
注意, await 关键字仅仅在 async function中有效。如果在 async function函数体外使用 await ,你只会得到一个语法错误(SyntaxError)。
async function testAsync() { return "Hello"; } const testResult = testAsync(); console.log(testResult); //Promise { 'Hello' } testAsync().then(v => { console.log(v); // 输出 Hello }); //使用await async function testAsnync1() { let result = await testAsync(); console.log(result); // Hello }
参考
《深入理解ES6》
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网
猜你喜欢:- 异步发展流程 —— Generators + co 让异步更优雅
- 复杂Vue组件的异步流程分析
- Node.js 异步流程控制模式
- 架构设计:异步处理流程,多种实现模式详解
- JS 异步发展流程(回调函数=>Async/await)
- SpringBoot | :异步开发之异步调用
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
计算机程序设计艺术卷1:基本算法(英文版.第3版)
Donald E.Knuth / 人民邮电出版社 / 2010-10 / 119.00元
《计算机程序设计艺术》系列著作对计算机领域产生了深远的影响。这一系列堪称一项浩大的工程,自1962年开始编写,计划出版7卷,目前已经出版了4卷。《美国科学家》杂志曾将这套书与爱因斯坦的《相对论》等书并列称为20世纪最重要的12本物理学著作。目前Knuth正将毕生精力投入到这部史诗性著作的撰写中。想了解本书最新信息,请访http://www-cs-faculty.stanford.edu/~knut......一起来看看 《计算机程序设计艺术卷1:基本算法(英文版.第3版)》 这本书的介绍吧!