es6非同步

promise, async/await

by Shang-De You

JavaScript

// ========== 定義 Promise任務 (API) ==========

let promiseTasks = {
	getName() {
  	return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("getName done")
        data = "James"
        resolve(data)
      }, parseInt(Math.random() * 500));
    })
  }, 
  getLocation() {
  	return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("getLocation done")
        data = "Taipei"
        resolve(data);
      }, parseInt(Math.random() * 500));
    })
  }, 
  getYear(){
  	return new Promise((resolve, reject) => {
      setTimeout(() => {
        console.log("getYear done")
        data = 2018
        resolve(data)
      }, parseInt(Math.random() * 500));
    })
  }
}



/*
Promise.all([getName, getLocation, getYear])
	.then((data)=> {
    // 一次性同時回傳成功訊息，回傳以上三個數值的陣列
    console.log(data);
  }).catch( err => {
    // 失敗訊息 (立即)
    console.log(err)
  })
*/
  
// ========== async function ==========  



let doSearch = () => {
	//查詢姓名
	let getName = promiseTasks.getName()
  //查詢地點
  let getLocation = promiseTasks.getLocation()
  //查詢年
  let getYear = promiseTasks.getYear()
  
  let async_viewData1 = async () => {
    let promise = await Promise.all([getName, getLocation, getYear])
    let data = {
      name: promise[0],
      location: promise[1],
      year: promise[2] + '年'
    }
    return data
  }

  let async_viewData2 = async () => {
    let promise = await Promise.all([getName, getLocation])
    let data = {
      fullName: promise[0],
      city: promise[1],
    }
    return data
  }

	async_viewData1()
    .then(result => {
      console.log(result)
    })
    .catch(err => {
      console.log("fail")
    })

  async_viewData2()
    .then(result => {
      console.log(result)
    })
    .catch(err => {
      console.log("fail")
    })
    
}

doSearch()