1.首先js是單線程的

所有的同步任務(wù)都是按順序依次執(zhí)行的，前面的執(zhí)行完了之后才會(huì)執(zhí)行后面的任務(wù)。遇到計(jì)算量大的代碼就會(huì)阻塞在這里。下面的代碼就是打印輸出10000次，當(dāng)循環(huán)走完了之后 才會(huì)走后面的代碼，輸出的時(shí)間是981ms

輸出981ms

2.因?yàn)閖s是單線程的，所有的任務(wù)都需要按順序執(zhí)行，那如果我在執(zhí)行過程中開啟了一個(gè)定時(shí)器，定時(shí)器延遲10秒執(zhí)行，后面的代碼是不是要十秒之后才執(zhí)行呢？

測(cè)試一下

輸出的結(jié)果表示：定時(shí)器后面的代碼先執(zhí)行了，而定時(shí)器里面的代碼再10秒后執(zhí)行了

?這是為什么呢？

因?yàn)閖s雖然是單線程，但是我們并不需要所有的代碼都要依次執(zhí)行，避免一些不必要的阻塞。所以就引入了事件循環(huán)隊(duì)列。引入了事件循環(huán)隊(duì)列之后，就將js中所有的代碼分成了兩大類 ，一類是同步代碼，另一類是異步代碼。同步代碼的執(zhí)行順序總是早于異步代碼。 可以理解成，js從上到下依次執(zhí)行，遇到同步的就直接執(zhí)行，遇到異步的，就將異步的代碼放到最后再執(zhí)行。

下面代碼的執(zhí)行順序是可以這樣理解，?從上到下依次執(zhí)行。先執(zhí)行一號(hào)代碼，是同步的，就直接輸出。然后執(zhí)行到二號(hào)代碼，是個(gè)定時(shí)器，定時(shí)器是異步的，所以放到最后面再執(zhí)行。然后執(zhí)行三號(hào)代碼，三號(hào)是同步的，直接輸出。然后執(zhí)行到四號(hào)代碼，四號(hào)代碼也是定時(shí)器，是異步的，所以放到最后(這個(gè)時(shí)候四號(hào)的異步代碼是在二號(hào)的異步代碼后面的)。然后執(zhí)行到五號(hào)代碼，直接輸出。這個(gè)時(shí)候同步的代碼已經(jīng)全部執(zhí)行完了，就開始執(zhí)行剛剛放到最后面的二號(hào)代碼和四號(hào)代碼。

所以輸出順序是 同步1，同步2，同步3，異步1，異步2

輸出結(jié)果

?

?而實(shí)際上，就是將異步的代碼放入任務(wù)隊(duì)列中去，等同步的代碼執(zhí)行完了之后，然后再去執(zhí)行任務(wù)隊(duì)列里的任務(wù)。

?文章來源地址http://www.zghlxwxcb.cn/news/detail-402229.html

?哪些任務(wù)會(huì)進(jìn)入任務(wù)隊(duì)列呢(異步任務(wù)有哪些)？

定時(shí)器，ajax異步請(qǐng)求，promise.then里的東西 等等

任務(wù)隊(duì)列又分成兩個(gè)，一個(gè)是宏任務(wù)隊(duì)列，一個(gè)是微任務(wù)隊(duì)列。微任務(wù)隊(duì)列里的任務(wù)要優(yōu)先于宏任務(wù)隊(duì)列里的任務(wù)

宏任務(wù)：定時(shí)器等

微任務(wù)：promise.then()里的代碼，promise是同步的，ajax異步請(qǐng)求等

上面代碼的執(zhí)行順序是(結(jié)合圖一起看)：

1.遇到了1號(hào)代碼，是同步的，直接執(zhí)行 輸出1號(hào)，同步1。

2.遇到了二號(hào)代碼，是個(gè)定時(shí)器，是宏任務(wù)，異步的。所以先不執(zhí)行，放入宏任務(wù)隊(duì)列

3.遇到三號(hào)代碼的promise，是個(gè)微任務(wù)，先不執(zhí)行，放入微任務(wù)隊(duì)列

4.遇到5號(hào)代碼，是同步的，直接執(zhí)行 輸出5號(hào)，同步2

?

5.這個(gè)時(shí)候同步代碼執(zhí)行完了，然后去任務(wù)隊(duì)列里找任務(wù)執(zhí)行。任務(wù)隊(duì)列里有兩個(gè)隊(duì)列，一個(gè)是宏任務(wù)隊(duì)列，里面有個(gè)定時(shí)器。還有一個(gè)微任務(wù)隊(duì)列，里面有個(gè)promse成功的回調(diào)。因?yàn)槲⑷蝿?wù)執(zhí)行順序是先于宏任務(wù)的，所以會(huì)先執(zhí)行promise里面的代碼

6.執(zhí)行promise里的代碼，遇到三號(hào)代碼了，是同步的 直接執(zhí)行 輸出3號(hào)，微任務(wù)1

7.繼續(xù)向下執(zhí)行 遇到4號(hào)的定時(shí)器了，4號(hào)定時(shí)器是異步的，并且是宏任務(wù)，所以先不執(zhí)行，放入宏任務(wù)隊(duì)列

?

8.這個(gè)時(shí)候微任務(wù)隊(duì)列里已經(jīng)沒有任務(wù)了，所以去執(zhí)行宏任務(wù)隊(duì)列里的任務(wù)。宏任務(wù)隊(duì)列里先在有兩個(gè)任務(wù)，一個(gè)是2號(hào)的定時(shí)器，一個(gè)是4號(hào)的定時(shí)器。

9.按順序，先執(zhí)行2號(hào)定時(shí)器里面的代碼，里面的代碼是同步的，直接執(zhí)行 輸出2號(hào)，宏任務(wù)1

?

10.執(zhí)行完宏任務(wù)里的第一個(gè)任務(wù)之后(2號(hào)定時(shí)器)，看一下微任務(wù)隊(duì)列里還有沒有任務(wù)，? ?有的話就繼續(xù)執(zhí)行微任務(wù)隊(duì)列里的任務(wù)，沒有的話就繼續(xù)執(zhí)行下一個(gè)宏任務(wù)隊(duì)列里的任務(wù)。

11.我們這里微任務(wù)隊(duì)列已經(jīng)沒有其他任務(wù)了，所以繼續(xù)執(zhí)行宏任務(wù)隊(duì)列里的任務(wù)。執(zhí)行4號(hào)定時(shí)器，里面的代碼是同步的，所以直接執(zhí)行，輸出 4號(hào)，promise里的定時(shí)器

輸出結(jié)果?

?

?

?

到了這里，關(guān)于js執(zhí)行順序的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！