//==回調地獄的解決方法 , 實際的業務問題:咱們須要按順序獲取:產品數據=>用戶數據=>評論數據 //1.傳統的寫法: // 獲取產品數據 ajax('products.json', (products) => { console.log('AJAX/products >>>', JSON.parse(products)); // 獲取用戶數據 ajax('users.json', (users) => { console.log('AJAX/users >>>', JSON.parse(users)); // 獲取評論數據 ajax('products.json', (comments) => { console.log('AJAX/comments >>>', JSON.parse(comments)); }); }); }); //2.用promise(ES6)封裝ajax: //封裝 Ajax,返回一個 Promise function requestP(url) { return new Promise(function(resolve, reject) { ajax(url, (response) => { resolve(JSON.parse(response)); }); }); } // 獲取產品數據 requestP('products.json').then((products) => { console.log('Promises/products >>>', products); // 獲取用戶數據 return requestP('users.json'); }).then((users) => { console.log('Promises/users >>>', users); // 獲取評論數據 return requestP('comments.json'); }).then((comments) => { console.log('Promises/comments >>>', comments); }); //3. await/async //async用來表示函數是異步的,定義的函數會返回一個promise對象,能夠使用then方法添加回調函數。 //await 後面能夠跟任何的JS 表達式,若是await的是 promise對象會形成異步函數中止執行而且等待 promise 的解決,若是等的是正常的表達式則當即執行。 // 封裝 Ajax,返回一個 Promise function requestP(url) { return new Promise(function(resolve, reject) { ajax(url, (response) => { resolve(JSON.parse(response)); }); }); } (async () => { // 獲取產品數據 let data = await requestP('products.json'); // 獲取用戶數據 let users = await requestP('users.json'); // 獲取評論數據 let products = await requestP('comments.json'); console.log('ES7 Async/products >>>', products); console.log('ES7 Async/users >>>', users); console.log('ES7 Async/comments >>>', comments); }());