资讯专栏INFORMATION COLUMN

理解JS执行顺序

Labradors / 1255人阅读

摘要:前言众所周知,的执行顺序是自上而下的。严格意义上来说,没有多线程的概念,所有的程序都是单线程依次执行的。代码的执行阶段,此阶段对变量进行赋值和函数的声明。

前言
众所周知,JS的执行顺序是自上而下的。
严格意义上来说,javascript没有多线程的概念,所有的程序都是单线程依次执行的。
就是代码在执行过程中,另一段代码想要执行就必须等当前代码执行完成后才可以进行。
注意
js代码执行分为两个部分:
1、代码的检查装载阶段(预编译阶段),此阶段进行变量和函数的声明,但是不对变量进行赋值,
   变量的默认值为undefined。
2、代码的执行阶段,此阶段对变量进行赋值和函数的声明。
所以:Js的变量提升和函数提升会影响JS的执行结果,ES6中的let定义的变量不会提升 
3、js的执行顺序,先同步后异步
4、异步中任务队列的执行顺序: 先微任务microtask队列,再宏任务macrotask队列
5、调用Promise 中的resolve,reject属于微任务队列,setTimeout属于宏任务队列
所以:【同步>异步;微任务>宏任务】

示例
console.log("event start")
setTimeout(function () {
    console.log("setTimeout");
});

new Promise(function(resolve,reject){
    console.log("promise start")
    resolve()
}).then(function(){
    console.log("promise end")
})
console.log("event end")

执行结果为:

event start
promise start
event end
promise end
undefined
setTimeout

解释:

主线程执行按顺序代码
遇到 setTimeout, 回调进入到宏任务队列上
遇到 Promise, 立即执行, then 函数进入到微任务队列
同步代码执行结束, 主线程检查是否存在微任务, 发现 then, 执行
微任务执行完毕, 再去查找宏任务 setTimeout, 执行
setTimeout 执行结束, 检查是否存在微任务, 不存在, 结束.

图例

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/104159.html

相关文章

  • javascript引擎执行的过程的理解--执行阶段

    摘要:如果对语法分析和预编译,还有疑问引擎执行的过程的理解语法分析和预编译阶段。参与执行过程的线程分别是引擎线程也称为内核,负责解析执行脚本程序的主线程例如引擎。以上便是引擎执行宏任务的整个过程。 一、概述 js引擎执行过程主要分为三个阶段,分别是语法分析,预编译和执行阶段,上篇文章我们介绍了语法分析和预编译阶段,那么我们先做个简单概括,如下: 1、语法分析: 分别对加载完成的代码块进行语法...

    SnaiLiu 评论0 收藏0
  • javascript引擎执行的过程的理解--执行阶段

    摘要:如果对语法分析和预编译,还有疑问引擎执行的过程的理解语法分析和预编译阶段。参与执行过程的线程分别是引擎线程也称为内核,负责解析执行脚本程序的主线程例如引擎。以上便是引擎执行宏任务的整个过程。一、概述 js引擎执行过程主要分为三个阶段,分别是语法分析,预编译和执行阶段,上篇文章我们介绍了语法分析和预编译阶段,那么我们先做个简单概括,如下: 1、语法分析: 分别对加载完成的代码块进行语法检验,语...

    Achilles 评论0 收藏0
  • Javascript 事件循环event loop

    摘要:现实中是这样的执行结果为结果告诉我们,是单线程没错,不过不是逐行同步执行。搜索了很多官方个人博客得到了一堆词引擎主线程事件表事件队列宏任务微任务,彻底懵逼。。。以此规则不停的执行下去就是我们所听到的事件循环。 都知道javascript是单线程,那么问题来了,既然是单线程顺序执行,那怎么做到异步的呢? 我们理解的单线程应该是这样的,排着一个个来,是同步执行。 showImg(https...

    Miyang 评论0 收藏0
  • 10分钟理解JS引擎的执行机制

    摘要:深入理解引擎的执行机制灵魂三问为什么是单线程的为什么需要异步单线程又是如何实现异步的呢中的中的说说首先请牢记点是单线程语言的是的执行机制。 深入理解JS引擎的执行机制 1.灵魂三问 : JS为什么是单线程的? 为什么需要异步? 单线程又是如何实现异步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4.说说setTimeout 首先,请牢记2...

    zzbo 评论0 收藏0
  • JS每日一题:函数式编程中代码组合(compose)如何理解?

    摘要:期函数式编程中代码组合如何理解定义顾名思义,在函数式编程中,就是将几个有特点的函数拼凑在一起,让它们结合,产生一个崭新的函数代码理解一个将小写转大写的函数一个在字符后加的函数将两个函数组合起来这里假设我们实现了每日一题每日一题显示结果里上面 20190315期 函数式编程中代码组合(compose)如何理解? 定义: 顾名思义,在函数式编程中,Compose就是将几个有特点的函数拼凑在...

    Kaede 评论0 收藏0

发表评论

0条评论

Labradors

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<