异步模式Asynchronous

不会等待这个任务结束才开始执行下一个任务,开启之后立即执行下一个任务,后续逻辑一般会通过回调函数的方式定义,异步模式对js 非常重要,没有异步任务单线程的 js 语言就无法同时处理大量耗时任务,单线程下面的异步最大的难点就是 代码的执行顺序混乱Queue是消息队列队列也叫回调队列

打印消息给同步一样执行压栈弹栈,接下来就是倒计时器,setTimeOut 就是调用了web apiweb api单独运行不会阻塞js的执行, 开启倒计时器之后 setTimeOut的调用就已经结束,会继续往下调用,同理压栈开启倒计时器弹栈,最后打印消息之后对于这个匿名函数就已经调用完了,这个时候我们的调用栈就会被清空掉,当调用栈执行完之后,Evevt loop就会从消息队列中取出第一个回调函数压入到调用栈,当倒计时器达到时间之后就会把回调函数放入到回调队列中。timer2倒计时先结束所以会先放入消息队列中的第一位, Evevt loop监听到消息队列发生变化,就会把timer2 放入到执行栈中去执行,这个时候对于调用栈来说就是开启了新一轮的执行,如果执行栈中的函数又开启了定时器,这个时候给前面的步骤是一样的,不断的去加入消息队列,不断的去提取消息队列中的函数来执行,直到调用栈和消息队列中都没有需要执行的函数整体的代码就结束了,javascript执行引擎就是先去执行调用栈中的任务,然后再通过事件循环从消息队列中再取一个任务执行,依次类推。我们随时都可以往消息队列放入任务,这些任务会排队执行。javascript异步实现原理内部就是通过消息队列和时间循环实现的

回调函数

所有异步编程方案根基都是回调函数,由调用者定义,交给执行者去执行的函数叫做回调函数

function foo (callback) {
setTimeOut(() => {
callback()
}, 3000)
} foo(() => {
console.log("恰饭饭")
})

原文地址: https://kspf.xyz/archives/19

更多内容微信公众号搜索充饥的泡饭

小程序搜一搜开水泡饭的博客

javascript编程单线程之异步模式Asynchronous的更多相关文章

  1. javascript编程单线程之同步模式

    javascript编程单线程之同步模式 主流的js 环境都是单线程吗模式执行js 代码, js采用为单线程的原因与最开始设计初衷有关,最早是运行在浏览器端的脚本语言,目的是为了实现页面上的动态交互, ...

  2. JavaScript 单线程之异步编程

    Js 单线程之异步编程 先了解一个概念,为什么 JavaScript 采用单线程模式工作,最初设计这门语言的初衷是为了让它运行在浏览器上面.它的目的是为了实现页面的动态交互,而交互的核心是进行 Dom ...

  3. Javascript教程:js异步模式编程的4种解决方法

    随着人们对网站视觉效果及用户体验的要求越来越高,所以在未来网站的建设中,设计师们开始越来越多的使用了js文件来达到预期的效果,随着js文件的越来越多,令设计师们最头痛的事情也就来了,那就是Javasc ...

  4. [转载]JavaScript异步编程助手:Promise模式

    http://www.csdn.net/article/2013-08-12/2816527-JavaScript-Promise http://www.cnblogs.com/hustskyking ...

  5. JavaScript异步编程助手:Promise模式

    :Promises是一种令代码异步行为更加优雅的抽象,它很有可能是JavaScript的下一个编程范式,一个Promise即表示任务结果,无论该任务是否完成. 异步模式在Web编程中变得越来越重要,对 ...

  6. 【JS】336- 拆解 JavaScript 中的异步模式

    点击上方"前端自习课"关注,学习起来~ JavaScript 中有很多种异步编程的方式.callback.promise.generator.async await 甚至 RxJS ...

  7. 【JS】285- 拆解 JavaScript 中的异步模式

    JavaScript 中有很多种异步编程的方式.callback.promise.generator.async await 甚至 RxJS.我最初接触不同的异步模式时,曾想当然的觉得 promise ...

  8. Javascript的单线程和异步编程

    运行时概念 下面的内容解释了一个理论上的模型.现代 JavaScript 引擎着重实现和优化了描述的几个语义. 可视化描述 栈 函数调用形成了一个栈帧. function foo(b) { var a ...

  9. JavaScript编程异步助手:Promise

    异步模式在Web编程中变得越来越重要,对于Web主流语言JavaScript来说,这种模式实现起来不是很利索,为此,许多JavaScript库(比如 jQuery和Dojo.AngularJS)添加了 ...

随机推荐

  1. 如何有效管理产品生命周期(How to Effectively Manage a Product Lifecycle)

    本文翻译自文章:How to Effectively Manage a Product Lifecycle 文章原文链接:https://medium.com/design-bootcamp/how- ...

  2. LuoguP3377 左偏树 (左偏树)

    TLE but corrct in most cases. inline int Find(int x){ //be careful with the way used for finding you ...

  3. .NET异步编程模式(一)

    .NET 提供了三种异步编程模型 TAP - task-based asynchronous pattern APM - asynchronous programming model EAP - ev ...

  4. 888. 公平的糖果交换--LeetCode

    来源:力扣(LeetCode) 链接:https://leetcode.cn/problems/fair-candy-swap 著作权归领扣网络所有.商业转载请联系官方授权,非商业转载请注明出处. 假 ...

  5. 【Go实战基础】创建并完成第一个可执行的 go 程序

    实战需求:创建并完成第一个可执行的 go 程序.项目目录:go-001具体实战步骤如下: 一.进入工程目录 cd go-001/ 二. 创建 g001.go 文件 /* * @Author: 菜鸟实战 ...

  6. 「题解报告」Blocks

    P3503 Blocks 题解 原题传送门 思路 首先我们可以发现,若 \(a_l\) ~ \(a_r\) 的平均值大于等于 \(k\) ,则这个区间一定可以转化为都大于等于 \(k\) 的.我们就把 ...

  7. Mybatis-Plus使用@TableField实现自动填充日期

    一.前言 我们在日常开发中经常使用ORM框架,比如Mybatis.tk.Mybatis.Mybatis-Plus.不过最广泛的还是Mybatis-Plus,我们的一些表,都会有创建时间.更新时间.创建 ...

  8. 第九十六篇:恶补JS基础

    好家伙,来补基础啦,补JS的基础 先来一些概念性的东西 1.什么是JavaScript?  javaScript的简写形式就是JS,一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态 ...

  9. MySQL到底有没有解决幻读问题?这篇文章彻底给你解答

    MySQL InnoDB引擎在Repeatable Read(可重复读)隔离级别下,到底有没有解决幻读的问题? 网上众说纷纭,有的说解决了,有的说没解决,甚至有些大v的意见都无法达成统一. 今天就深入 ...

  10. 装饰Hexo博客以及部署个人站点

    我的博客最开始采用的是Hexo+hexo-theme-next搭建的,使用GitHub Pages托管并进行自动化部署,写文发布的流程非常简单方便,云端写作发布也轻而易举. 本来事情到这里就应该结束了 ...