JS代码执行小demo

最新推荐文章于 2022-06-26 07:21:53 发布

m0_55918015

最新推荐文章于 2022-06-26 07:21:53 发布

阅读量251

点赞数

文章标签： typescript javascript 前端

本文链接：https://blog.youkuaiyun.com/m0_55918015/article/details/125254692

版权

本文深入探讨了JavaScript中的异步执行原理，通过示例解析了函数调用、变量提升、预编译及异步操作如setTimeout和async函数的执行顺序。重点在于理解函数定义、函数调用、异步操作和作用域之间的关系，以及++运算符在不同上下文中的行为。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1     let a=0,b=0  
2      function fn(a) {
3      fn=function fn2(b){
4        console.log(++a+b)
5      }
6      console.log(a++)
7     }
8     fn(1)
9     fn(2)

执行答案先上：

执行顺序：1823694

几个注意点：

Ⅰ.2是一个函数，8是函数调用，因此执行完8就会跑到2

Ⅱ.3是一个赋值，因为带有“=”，并未执行新的函数调用，因此在8执行的时候，4并未执行

Ⅲ.++a和a++的区别，在2这个函数执行时，会先让a的赋值发生变化，但不是执行打印，因为3中只是赋值，但没有函数调用

Ⅳ.3执行完后，a=1，走到6，打印出来1，但是执行完6，a已经=2，最后走到4，a=3，b=2，打印出来5

async function async1(){
   console.log('async1 start');
   await async2();  
    //会先执行async2函数，然后跳出async1，执行同步语句，然后将返回的promise放入微队列
   // 会立即放入微队列，相当于.then,所以会在promise2的前面
   console.log('async1 end');
}
async function async2(){
   console.log('async');
}
console.log('script start');
setTimeout(function (){
   console.log('setTimeout');
},0);
async1();
new Promise(function(resolve){
   console.log('promise1');
   resolve();
}).then(function(){
   console.log('promise2');
});
console.log('script end');

script start
async1 start
async
promise1
script end
async1 end
promise2
setTimeout