异步模式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. Apache DolphinScheduler 需要的sudo,还可以这么玩,长见识了!

    Apache DolphinScheduler(incubator)需要的sudo,还可以这么玩,长见识了! 在新一代大数据任务调度 - Apache DolphinScheduler(以下简称dol ...

  2. 重看Java教学视频时的查漏补缺

    数据类型 1.基本数据类型:四类八种. 2.数据范围与字节数不一定相关.如float为4字节表示范围比long的8字节要大. 3.浮点数默认double类型,如要用float,需加F. 4.boole ...

  3. Canvas 非线性图形(一):文本

    基础 画布除了绘制图形以外还可以绘制文本,画布中的文本可以设置字体大小.字体格式.对齐方式(横向和纵向对齐方式),并且还可以制作很炫酷的文本,比如渐变文字. 文本有以下三个属性,控制文本的字体大小.字 ...

  4. docker启动失败问题

    内核3.10,systemctl start docker 被阻塞,没有返回,查看状态为启动中. 某兄弟机器安装docker之后,发现systemctl start docker的时候阻塞,由于排查走 ...

  5. 如何使用CSS伪类选择器

    总览 CSS选择器允许你通过类型.属性.位于HTML文档中的位置来选择元素.本教程阐述了三个新选项:is().:where()和:has(). 选择器通常在样式表中使用.下面的示例会找到所有<p ...

  6. 截取url后缀扩展名方法

    原本使用 Path(_['video']['downloadUrl']).suffix 获取文件扩展名,没想到出错了,查明原因发现某视频链接是https://xx.xxx.xxx/xx/xxxx.mp ...

  7. Java 多线程:基础

    Java 多线程:基础 作者:Grey 原文地址: 博客园:Java 多线程:基础 CSDN:Java 多线程:基础 顺序.并行与并发 顺序(sequential)用于表示多个操作『依次』处理.比如把 ...

  8. js工厂模式和构造函数

    <!DOCTYPE html><html><head> <title>工厂模式和构造函数</title> <meta charset ...

  9. .NET 反向代理-YARP 根据域名转发

    前段时间发布过一个关于 YARP 的简单介绍,感兴趣的小伙伴恭请移步看看 .NET 反向代理-YARP - 一事冇诚 - 博客园 (cnblogs.com) 作为反向代理,必不可少的当然是根据域名代理 ...

  10. Kubernetes Operator: Operator

    Operator 就可以看成是 CRD 和 Controller 的一种组合特例,Operator 是一种思想,它结合了特定领域知识并通过 CRD 机制扩展了 Kubernetes API 资源,使用 ...