技術標籤：JavaScriptes6javascriptjses6

優美的進行延時處理
舉一反三將會有更好的用法

<script>
	//要延時載入的資料
	const bb = [{age:10},{age:11},{age:12}];
	//定義一個async函式返回一個Promise
	async function cc(){
		return new Promise((resolve,reject)=>{
			//使用定時器進行延時傳送通知
			setTimeout(()=>{
				resolve();
			},1500)
		})
	}
	//定義
	async function dd(){
		for(const ee of bb){
			//【重點】這裡會等待cc函式中的Promise傳送了通知才會往下執行
			await cc();
			console.log(ee.age);
		}
	}
	//呼叫
	dd();
</script>
 

主執行緒中的程式碼只有呼叫dd函式，執行dd函式會進入迴圈，而從第一次迴圈中開始就要等待cc函式返回一個結果，否則不往下執行。而cc函式中，要等待1500毫秒才會傳送一個通知結果。所以每迴圈一次就要等待1.5秒返回通知結果，就有了後面的延時效果

async關鍵字：

放置在一個函式前面，函式前面的async意味著這個函式將return一個Promise。
如果return的不是Promise，js會自動把return的值包裝為Promise中resolve的值。

await關鍵字：

可以讓JavaScript等待執行，只有等到了返回結果，JavaScript才會往下執行。

async function aa(){
	let bb = await 'bb';
	let cc = await new Promise((resolve,reject)=>{
		resolve('cc');
	})
	console.log(bb);//bb
	console.log(cc);//cc
}
aa();
 

注：不能在普通函式中使用await,呼叫async函式和普通函式呼叫一樣。即：aa();