<!DOCTYPE html>
<html>
<head>
<title>Promise、async、await</title>
</head>
<body>
<script type="text/javascript">
//promise用法(返回異步方法返回的數據,resolve獲取數據成功后調用的方法, reject獲取數據失敗后調用的方法)
//第一種寫法
var p = new Promise((resolve,reject) => {
//模擬ajax請求異步獲取數據
setTimeout(() => {
let name = 'lindont';
resolve(name); //成功調用的函數
//reject('error'); //失敗調用的函數
},1000);
});
p.then((data) => {
console.log(data);
});
//第二種寫法
var getData = (resolve,reject) => {
setTimeout(() => {
let name = 'HuangHaoXin';
resolve(name);
},1000);
}
var p2 = new Promise(getData);
p2.then((data) => {
console.log(data);
});
//async 和 await (async可以將一個同步的方法改為異步方法, await具有阻塞功能變相把一個異步方法變成同步方法, await必須用在async方法中)
//第一種寫法
var getData2 = async () => {
console.log(2);
return 'async data'
}
var test = async () => {
console.log(1);
var d = await getData2();
console.log(d);
console.log(3);
}
test(); //結果按順序輸出 1 2 3,說明await等待getData2方法執行完畢再往下執行(即自定義一個異步方法，使用await等待另一個異步方法執行完畢，此時異步方法變相成為了同步)
//第二種寫法
var getData3 = () => {
return new Promise((resolve,reject) => {
setTimeout(() => {
var username = 'good day';
resolve(username);
},1000);
});
}
var test2 = async () => {
var data = await getData3();
console.log(data);
}
test2();
</script>
</body>
</html>
