js面試必備知識，關注作者查看系列js知識體系
導語：JavaScript是一門單執行緒的語言，那么他要是在某一步卡死了，或者是請求資源等待回應，那是不是整個專案都停止了？答案是不是的，因為他有異步操作，
本文的目錄
- 1，什么是同步和異步
- 2，異步和它造成的問題
- 三，對js單執行緒的知識點進行了補充，滿滿干貨，
1，什么是同步和異步
我們先來看一段代碼，你覺得他會輸出什么？
console.log(100)
setTimeout(() => {
console.log(200)
}, 1000)
setTimeout(() => {
console.log(300)
}, 0)
console.log(400)
// 答案 100 400 300 200
我們先明確一個定義，JavaScript是一個單執行緒的語言，就是它只能同時做一件事，js和dom渲染共用一個執行緒，這就會導致在做一些需要回應的操作時，就會停住無法繼續執行后面的代碼，那為什么不給他變成多執行緒的呢？這是因為要是變成多執行緒，要是一個執行緒給dom檔案添加東西，一個給刪東西，那到底要以哪個為標準呢？所以導致JavaScript是一門單執行緒的語言，那怎么解決這些問題呢，就需要用到異步操作，
這里的setTimeout就是一個設定計時器的東西，然后設定一個回呼函式，就是異步操作，JavaScript的異步不會阻塞后面代碼的執行，等到時間到了就會執行這個異步操作，
2，異步和它造成的問題
相信大家都會遇到一個問題，去請求一個后臺介面，然后在把請求到的東西加載到頁面上，但是還沒請求到資源，就已經把那些后續的操作執行完了，導致頁面例外，很多的undefined，異步就能夠把這個問題解決，通過回呼函式將資料加載到頁面上，
$.get(url, (res) => {
this.data = res.data
})
但是又會出現另外一個問題，要是你要將請求到的資料中的某個資料再去請求，以此往復，就會形成一個回呼地獄（callback hell），
$.get(url1, (res1) => {
this.data = res1.data
$.get(url2, (res2) => {
this.data = res2.data
$.get(url3, (res3) => {
this.data = res3.data
})
})
})
這種嵌套的方式幾個還好，要是出現十多個，遲早會把程式員給繞暈，同時代碼也不易維護，那么這個異步回呼函式造成的回呼地獄怎么解決呢？就要用到promise來解決，他能把這個嵌套的模式改寫成一個鏈式的模式，從而比較容易寫和看懂，方便維護，
function getData(url) {
return new Promise(
(resolve, reject) => {
$.ajax({
url,
success(data) {
resolve(data)
},
error(err) {
reject(err)
}
})
}
)
}
getData(url1).then(res => {
console.log(res.url2)
return getData(res.url2)
}).then(res => {
console.log(res.url3)
return getData(res.url3)
}).then(res => {
console.log(res)
}).catch(err => {
console.error(err)
})
這樣就完美解決了這個嵌套的問題了，變成一條鏈式的形狀，
三，對js單執行緒的知識點進行了補充，滿滿干貨，
篇幅有點長，所以把它放在了另外的一篇博客中，超級詳細，看完就能完全理解js的單執行緒，
https://blog.csdn.net/gitchatxiaomi/article/details/108054585
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/131683.html
標籤：其他
上一篇：CCS錯誤提示怎么解決
下一篇：求助呀