HTML语言可以实现异步调用,用定时器实现JavaScript异步执行

逆战班学习心得

JavaScript是一门基于对象的弱类型语言，它作为浏览器脚本语言，主要用途是负责与页面的交互，以及操作DOM，它的执行环境是单线程的，默认情况JS是同步加载的，也就是 JS的加载是阻塞的，也就是说同一时间只能完成一件事，只能自上而下执行,万一上一行解析代码的时间很长,那么下面的代码就会被阻塞。对于用户而言,阻塞就意味着"卡死",这样就导致了很差的用户体验。

为了解决这个问题，利用多核CPU的计算能力，于是出现了同步和异步

同步操作，任务遵循队列顺序，异步操作，就相当于并线了，因此异步任务不具有阻塞效应。同步任务都是在主线程中执行,形成了一个执行栈，直到主线程空闲时,才会去事件队列中查看是否有可执行的异步任务,如果有就推入主进程中。

JS是通过回调函数实现异步的。

一旦用了setTimeout()，里面的回调函数就是异步代码，加入了任务队列，延时调用一个函数不马上执行，而是要等待主队列为空，并达到定的延时时间才会执行，而且只会执行一次。

我们来通过下面一个例子来理解

1 setTimeout(function(){

2 console.log("1")

3 },500)

4 console.log("2")

5 setTimeout(function(){

6 console.log("3")

7 },300)

8 setTimeout(function(){

9 console.log("5")

10 },0)

11 console.log("4")

上面一段代码的输出结果为

2

4

5

3

1

从输出结果中，我们就可以看书JS执行的顺序，2和4都为主队列的同步任务，一开始就执行，执行顺序是从上到下。

setTimeout()中的函数，无论写在JS代码中的哪个位置，设置的时间即使是0，都为异步执行，在任务队列中，从主线程执行一开始，就进行计时，一旦主线程空闲，时间短的就立即加入到主线程开始执行，时间长的依然在等待。所以根据设定的等待时间，执行顺序为5,3,1

利用setInterval()实现异步执行

定时器的执行原理与延时器相似，只是不清除定时器，他就会反复执行。

1 console.log("1")

2 setInterval(function(){

3 console.log("2")

4 },300)

5 console.log("3")

总结，异步执行的两个必要条件就是

主队列空闲

到达执行时间

标签：异步,定时器,console,log,setTimeout,JavaScript,JS,执行

来源： https://www.cnblogs.com/521zyn666/p/12653386.html