Javascript基礎知識體系化學習總結（四）異步
一、單線程
1.javascript是單線程語言，只能同時做一件事，代碼從上往下執行，一個個加載。
2.javascript和DOM渲染共用一個線程，即兩者只能同時進行一個。
3.瀏覽器和node.js已經支持javascript啓動進程，例如WebWorker。
二、callback
1.callback即是回調函數，是來處理異步的，至於爲什麼會出現異步的情況，是因爲js單線程很可能導致我們加載某些內容的時候等待時間過長卡住。
2.callback本身不足，很容易引起回調地獄，不僅閱讀困難，也很難去維護這些代碼。
三、應用場景
1.同步和異步的區別：同步會阻塞代碼的執行，異步不會阻塞代碼的執行。
2.發送網絡請求的時候例如請求一些資源（圖片等等）。
3.出現定時任務的時候如setTimeout和setInterval。
四、Promise
1.爲了解決使用callback產生的回調地獄，promise採用了並行的書寫方式，區別於callback的嵌套方式。
2.關於具體如何使用promise，我們給出一個手寫promise加載圖片的函數熟悉一下：
<!DOCTYPE html>
<html>
<head>
<title>手寫promise加載圖片</title>
</head>
<body>
<script type="text/javascript">
function loadImage(src) { // 定義promise加載圖片的方法
const p = new Promise((resolve, reject)=>{ // 將整個promise賦值給一個變量，方便後面直接返回變量
const img = document.createElement('img')
img.src = src // 在DOM創建一個img標籤並且指定圖片地址爲我們的傳入的地址
img.onload=()=>{
resolve(img)
} // 圖片成功加載則觸發resolve狀態，並且返回img標籤（帶地址），調用者用.then接收
img.onError=()=>{
const err = `圖片加載失敗${src}`
reject(err)
} // 圖片加載失敗則觸發reject，並且把錯誤信息傳回去，調用者用.catch接收
})
return p // 返回變量
}
const url1 = 'https://www.3dmgame.com/uploads/images/thumbztfirst/20180824/1535097139_983975.jpg'
const url2 = 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3719520752,2657134858&fm=26&gp=0.jpg'
loadImage(url1) // 調用我們定義的方法
.then((img)=>{
console.log(img.width);
return img // 成功加載第一張圖片時打印其寬並且返回img標籤，方便下一個then使用
})
.then((img)=>{
console.log(img.width);
return loadImage(url2) // 這裏調用我們定義的方法，準備加載第二張圖片
})
.then((img)=>{
console.log(img.width);
return img
})
.then((img)=>{
console.log(img.height);
})
.catch((err)=>{
console.log(err);
})
</script>
</body>
</html>
好了，javascript的第四個模塊大概就是這些內容了，我會將它分爲11個模塊然後13篇文章左右把它講完（有的模塊內容多會範圍上下期大概。。。），學完這些模塊相信大家對基礎的js會有一個比較體系化的認識，那麼大家加油，我是O5,我們下次見！