目錄
什麼是 Promise
Promise 的基本用法
JavaScript 的執行環境是單線程。
所謂單線程，是指 JS 引擎中負責解釋和執行 JavaScript 代碼的線程隻有一個，也就是一次隻能完成一項任務，這個任務執行完後才能執行下一個，它會「阻塞」其他任務。這個任務可稱為主線程。
異步模式可以一起執行多個任務。
常見的異步模式有以下幾種：
- 定時器
- 接口調用
- 事件函數
js 中常見的接口調用方式，有以下幾種：
- 原生 ajax
- 基于 jQuery 的 ajax
- Fetch
- Promise
- axios
多次異步調用的依賴分析
- 多次異步調用的結果，順序可能不同步。
- 異步調用的結果如果存在依賴，則需要嵌套。
在 ES5 中，當進行多層嵌套回調時，會導緻代碼層次過多，很難進行維護和二次開發。而且會導緻回調地獄的問題。ES6 中的 Promise 就可以解決這兩個問題。
什麼是 Promise
ES6 中的 Promise 是異步程式設計的一種方案。從文法上講，Promise 是一個對象，它可以擷取異步操作的消息。
Promise 對象, 可以将異步操作以同步的流程表達出來。
使用 Promise 主要有以下好處：
- 可以很好地解決回調地獄的問題（避免了層層嵌套的回調函數）。
- 文法非常簡潔。Promise 對象提供了簡潔的 API，使得控制異步操作更加容易。
回調地獄的舉例
假設買菜、做飯、吃飯都是異步的。
但真實的場景中，實際的操作流程是：買菜成功之後，才能開始做飯。做飯成功後，才能開始吃飯。這裡面就涉及到了多層嵌套調用，也就是回調地獄。
Promise 的基本用法
使用
new
執行個體化一個 Promise 對象，Promise 的構造函數中傳遞一個參數。這個參數是一個函數，該函數用于處理異步任務。
并且傳入兩個參數：
resolve
和
reject
，分别表示異步執行成功後的回調函數和異步執行失敗後的回調函數。
通過
promise.then()
處理傳回結果。這裡的
promise
指的是 Promise 執行個體。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Promise 的基本用法</title>
</head>
<body>
<script type="text/javascript">
const runAsync = () => {
// 第一步：model層的接口封裝
let promise = new Promise((resolve, reject) => {
// 這裡做異步任務（比如 ajax 請求接口，這裡暫時用定時器代替）
setTimeout(() => {
// 接口傳回的資料
const data = { code: 200, msg:'hello world' }
if (data.code === 200) {
// 接口請求成功時調用
resolve(data)
} else {
// 接口請求失敗時調用
reject({ code: 500, msg: 'network error' })
}
}, 1000)
})
// 第二步：業務層的接口調用。這裡的 res 就是 從 resolve 和 reject 傳過來的，也就是從接口拿到的資料
.then(res => {
// 從 resolve 擷取正常結果
console.log(res)
})
.catch(res => {
// 從 reject 擷取異常結果
console.log(res)
})
return promise
}
runAsync()
</script>
</body>
</html>
上方代碼中，當從接口傳回的資料
data.code
的值不同時，可能會走 resolve，也可能會走 reject，這個由你自己的業務決定。
![實作電腦功能[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)