什么是異步？
異步與同步是相反的
簡單來理解就是：同步按你的代碼順序執行，異步不按照代碼順序執行，異步的執行效率更高，
什么時候用異步編程
在前端編程中（甚至后端有時也是這樣），我們在處理一些簡短、快速的操作時，例如計算 1 + 1 的結果，往往在主執行緒中就可以完成，主執行緒作為一個執行緒，不能夠同時接受多方面的請求，所以，當一個事件沒有結束時，界面將無法處理其他請求，
現在有一個按鈕，如果我們設定它的 onclick 事件為一個死回圈，那么當這個按鈕按下，整個網頁將失去回應，
為了解決類似這種問題，JavaScript 中的異步操作函式往往通過回呼函式來實作異步任務的結果處理，
回呼函式
回呼函式就是一個函式，它是在我們啟動一個異步任務的時候就告訴它：等你完成了這個任務之后要干什么，這樣一來主執行緒幾乎不用關心異步任務的狀態了，他自己會善始善終，
例如：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>回呼</title>
</head>
<body>
<button>點擊</button>
<p></p>
<script>
var btn = document.querySelector('button');
function fn1(){
btn.onclick = function(){
document.querySelector('p').innerHTML = '我出現了！'
}
}
setTimeout(fn1,1000)
</script>
</body>
</html> 
它的第一個引數是個回呼函式，第二個引數是毫秒數，這個函式執行之后會產生一個子執行緒，子執行緒會等待 1 秒，然后執行回呼函式 "fn1"，在命令列輸出 "我出現了！"，
Promise 的使用
語法格式：
new Promise(function (resolve, reject) {
console.log("Run");
});resolve和reject是引數
再看這個例子：
new Promise(function (resolve, reject) {
var a = 0;
var b = 1;
if (b == 0) reject("Divide zero");
else resolve(a / b);
}).then(function (value) {
console.log("a / b = " + value);
}).catch(function (err) {
console.log(err);
}).finally(function () {
console.log("End");
});這段列印結果為：
.then() .catch() 和 .finally() 三個方法
這三個方法的引數都是一個函式，
.then() 可以將引數中的函式添加到當前 Promise 的正常執行序列，
.catch() 則是設定 Promise 的例外處理序列，
.finally() 是在 Promise 執行的最后一定會執行的序列， .then() 傳入的函式會按順序依次執行，有任何例外都會直接跳到 catch 序列：
new Promise(function (resolve, reject) {
console.log(1111);
resolve(2222);
}).then(function (value) {
console.log(value);
return 3333;
}).then(function (value) {
console.log(value);
throw "An error";
}).catch(function (err) {
console.log(err);
});列印結果為：
1111 2222 3333 An error
resolve() 中可以放置一個引數用于向下一個 then 傳遞一個值，then 中的函式也可以回傳一個值傳遞給 then，但是，如果 then 中回傳的是一個 Promise 物件，那么下一個 then 將相當于對這個回傳的 Promise 進行操作，這一點從剛才的計時器的例子中可以看出來，
reject() 引數中一般會傳遞一個例外給之后的 catch 函式用于處理例外，
但是請注意以下兩點：
- resolve 和 reject 的作用域只有起始函式，不包括 then 以及其他序列；
- resolve 和 reject 并不能夠使起始函式停止運行，別忘了 return，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/319804.html
標籤：其他
上一篇：JS執行順序??