1. 程式人生 > >手寫 ES6 promise

手寫 ES6 promise


    <!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>promise物件原理詳解</title>
    </head>
    <body>
    		
    </body>
    <script type="text/javascript">
     
    	// 建立promise物件(同步的)
    	let promise = new Promise((resolve,reject) => {
    		// 初始化promise狀態為: pending
    		console.log(111)
    		// 執行非同步操作,通常是傳送ajax請求,開啟定時器
    		setTimeout(() => {
    			console.log(333)
    			// 根據非同步任務的返回結果去修改promise的狀態(原理)
    			// 非同步任務成功
    			resolve('哈哈 成功了!');// 自動修改promise的成功狀態: fullfilled
    			// 非同步任務失敗
    			reject(); // 自動修改promise的失敗狀態: rejected
    		},2000)
    	})
    	console.log(222);// 先列印111 再222
    	
    	promise.then((data) => {//成功的回撥
    		console.log(data, '成功了');// resolve()執行後 執行
    	},(error) => {// 失敗的回撥
    		console.log('失敗了');// reject()執行後 執行
    	})
     
    </script>
    </html>