promise
定義：是ES6新增的一個(gè)對(duì)象。我們可以使用promise來許下一個(gè)承諾。
promise用來處理異步代碼。把異步代碼寫成同步形式。解決回調(diào)地獄。
promise有三種狀態(tài)：
1、Pending：進(jìn)行中。（會(huì)變化）
2、Resolved(又稱Fufilled)：已完成。不會(huì)變化
3、 Rejected：已失敗。不會(huì)變化
注意：只有異步操作的結(jié)果，可以決定當(dāng)前是哪一種狀態(tài)，任何其他操作都無法改變這個(gè)狀態(tài)。
使用promise的時(shí)候
1、先new一個(gè)實(shí)例對(duì)象。需要傳兩個(gè)函數(shù)
new Promise((resolve, reject) => {
setTimeout(() => {
let num = Math.random()
if (num > 0.5) resolve()
else reject()
}, 1000);
})
2、聲明一個(gè)變量接收這個(gè)實(shí)例對(duì)象
let pro = new Promise((resolve, reject) => {
setTimeout(() => {
let num = Math.random()
//resolve實(shí)際上執(zhí)行的是then里面的代碼
if (num > 0.5) resolve()
else reject()
}, 1000);
})
3、然后再變量名.then(成功之后要做的事情）.catch（失敗之后要做的事）
pro.then(() => {
console.log('這個(gè)數(shù)比較大');
}).catch(() => {
console.log('這個(gè)數(shù)比較小');
})
promise封裝get
1、封裝
// 基于promise的get請(qǐng)求
// return new promise
fetch: function (url, query, isJSON) {
if (query) {
url += '?'
for (var key in query) {
url += `${key}=${query[key]}&`
}
url=url.slice(0,-1)
}
return new Promise(function(resolve,reject){
let xhr=new XMLHttpRequest()
xhr.open('get',url)
xhr.send()
xhr.onreadystatechange=function(){
if (xhr.readyState===4) {
if (xhr.status===200) {
let resp=isJSON?JSON.parse(xhr.responseText):xhr.responseText
resolve(resp)
}else {
reject()
}
}
}
})
}
2、在頁面中使用：
<button onclick="setMsg()">發(fā)送請(qǐng)求</button>
<body>
<script>
function setMsg() {
// 把異步代碼寫成同步形式，不用傳會(huì)低矮函數(shù)了，而是在then里面處理成功之后的函數(shù)
util.fetch('地址', { 參數(shù) }, true).then(function (resp) {
console.log(resp);
})
}
</script>
</body>
