1. 程式人生 > >ES6中 promise非同步載入的用法

ES6中 promise非同步載入的用法

1:單個promise

    let p=new Promise(function (resolve, reject){
      $.ajax({
        url: 'data/arr2.txt',
        dataType: 'json',
        success(arr){
          resolve(arr);
        },
        error(err){
          reject(err);
        }
      })
    });
 
    p.then(function (arr){
      alert('成功'+arr);
    }, function (err){
      console.log(err);
      alert('失敗了'+err);
    });


2:載入兩個promise

    function createPromise(url){
      return new Promise(function (resolve, reject){
        $.ajax({
          url,
          dataType: 'json',
          success(arr){
            resolve(arr);
          },
          error(err){
            reject(err);
          }
        })
      });
    }
 
    Promise.all([
      createPromise('data/arr.txt'),
      createPromise('data/json.txt')
    ]).then(function (arr){
      let [res1, res2]=arr;
      alert('全都成功了');
      alert(res1);
      alert(res2);
    }, function (){
      alert('至少有一個失敗了');
    });

3:jquery改進版

    Promise.all([
      $.ajax({url: 'data/arr.txt', dataType: 'json'}),
      $.ajax({url: 'data/json.txt', dataType: 'json'})
    ]).then(function (results){
      let [arr, json]=results;
 
      alert('成功了');
      console.log(arr, json);
    }, function (){
      alert('失敗了');
    });

或者

    Promise.all([
      $.ajax({url: 'data/arr.txt', dataType: 'json'}),
      $.ajax({url: 'data/json.txt', dataType: 'json'}),
      $.ajax({url: 'data/num.txt', dataType: 'json'})
    ]).then(results=>{
      let [arr, json, num]=results;
 
      alert('成功了');
 
      console.log(arr, json, num);
    }, err=>{
      alert('失敗了');
    });