什么是JavaScript异步模式

菜园前端
• 阅读 500

原文链接:https://note.noxussj.top/?source=helloworld


什么是异步模式?

不会等待当前任务执行完毕,才会去执行下一个任务,这就是异步模式(Asynchronous)。开启异步后,就会跳过本任务,开始执行下一个任务,后续的逻辑一般会通过回调函数的方式定义。异步模式执行中,涉及到调用栈(Call stack)、消息队列(Queue)、微任务队列(Microtask Queue)、事件循环(Eevent Loop)、运行环境(浏览器是 WebAPIs)。

现实生活举例 回到同步模式的现实生活举例上,我们可以修改一下验核酸的排队规则,已经准备好三个码的人可以先进入队列中进行排队,还没准备好的先站在旁边弄,什么时候弄好了就什么时候在去队伍中排队验核酸。这样就可以大大节省了大家的时间。

优点

主要解决同步模式造成的阻塞问题

缺点

代码的执行顺序混乱,并非从上往下一个个执行,有时候无法得知谁先执行谁后执行,所以不易于阅读和理解。

异步方案

  • ES2015 提供的 Pormise 方案
  • ES2015 提供的 Generator
  • ES2017 提供的 Async / Await 语法糖(可以写出更扁平的异步代码)

基础案例

console.log('global begin')

setTimeout(() => {
    console.log('timer1 invoke')
}, 1800)

setTimeout(() => {
    console.log('timer2 invoke')

    setTimeout(() => {
        console.log('inner invoke')
    }, 1000)
}, 1000)

console.log('global end')

什么是JavaScript异步模式

点赞
收藏
评论区
推荐文章
Souleigh ✨ Souleigh ✨
3年前
理解 Javascript 中的 Async / Await
在本文中,我们将探讨async/await,对于每个Javascript开发人员来说,是异步编程的首选工具。如果您不熟悉javascript,请不要担心,本文将帮助您async/await从头开始理解。介绍async/await是javascript中的一种模式,可使您的代码以同步方式执行,但又不影响javascript的异步行为。定义异步功能要定义一
皮卡皮卡皮 皮卡皮卡皮
3年前
ajax
ajax定义:异步的JavaScript和XML是一种综合技术:运用了XMLHTTPRequest(xhr)和服务器交换数据,通过JavaScript局部渲染页面,从而实现异步的局部更新同步与异步同步代码按顺序执行,会阻塞代码执行(alert)异步不会阻塞代码XMLHTTPRequestxhrjsvarxhrnew
菜园前端 菜园前端
1年前
什么是JavaScript同步模式?
原文链接:什么是同步模式?大部分单线程任务都会排队执行任务,这就称为同步模式(Synchronous)。同步模式执行中,只涉及到调用栈(Callstack)。现实生活举例就像验核酸一样,我们要排队一个个去验(按顺序排队),当只有一条通道(也就是单线程)时,
菜园前端 菜园前端
1年前
什么是JavaScript 调用栈?
原文链接:什么是调用栈?我们写的JS代码大多数都是同步模式,也就是从上往下依次执行。后一个任务必须要等前一个任务结束才能开始执行,程序的执行顺序和我们代码的编写顺序是完全一致的。程序执行中每遇到一个任务都会先入栈,当前入栈的任务执行完毕后就会出栈。本来栈的
Stella981 Stella981
3年前
JavaScript:再谈Tasks和Microtasks
JavaScript是单线程,也就是说JS的堆栈中只允许有一类任务在执行,不可以同时执行多类任务。在读js文件时,所有的同步任务是一条task,当然了,每一条task都是一个队列,按顺序执行。而如果在中途遇到了setTimeout这种异步任务,就会将它挂起,放到任务队列中去执行,等执行完毕后,如果有callback,就把callback推入到Tasks中去,
Stella981 Stella981
3年前
AJAX与Django
AJAX什么是AJAX?AJAX不是JavaScript的规范,它的缩写:AsynchronousJavaScriptandXML,意思就是用JavaScript执行异步网络请求。提交任务之后,不原地等待,直接执行下一行代码,任务的返回通过回调机制。局部刷新,不整体刷新,而是界面莫个地方局部刷新AJAX原理
Stella981 Stella981
3年前
Event事件
07.07自我总结Event事件一.导入模块fromthreadingimportEvent二.概念线程间状态同步:即将一个任务丢到子进程中,这个任务将异步执行,如何获取到这个任务的执行状态注意:执行状态和执行结果不是同一个概念,异步回调拿到的是任务
Stella981 Stella981
3年前
ES6 Promise
Promisepromise是异步编程的一种解决方案1什么是异步?异步模式,每一个任务有一个或多个回调函数(callback),前一个任务结束后,不是执行后一个任务,而是执行回调函数,后一个任务则是不等前一个任务结束就执行,所以程序的执行顺序与任务的排列顺序是不一致的、异步的。"异步模式"非常重要。在浏
Stella981 Stella981
3年前
JavaScript 异步编程
❝掌握JavaScript主流的异步任务处理(本篇文章内容输出来源:《拉钩教育大前端训练营》参阅《你不知道的JavaScript中卷》异步章节)❞JavaScrip采用单线程模式工作的原因,需要进行DOM操作,如果多个线程同时修改DOM浏览器无法知道以哪个线程为主。JavaScirpt分为:同步模式、异步模式同步
Stella981 Stella981
3年前
Spring 异步调用,多线程,一行代码实现
Spring异步调用,多线程概述快速入门异步回调异步异常处理自定义执行器1、概述在日常开发中,我们的逻辑都是同步调用,顺序