天天看點

js promise object

use strict'

// 異步計算,隊列化,類比callback

// 都不是單純的普通方法,都是promise對象才生效,對象可以儲存狀态,函數隻有通過閉包才能儲存狀态

// 異步操作的常見方法:回調和事件監聽

// 異步回調容易層次過深,可讀性差,維護性差

// 異步回調剝奪了return的能力

// promise的三個狀态:pending初始狀态,fulfilled操作成功,rejected操作失敗

// .then()傳回新的promise執行個體,由此實作鍊式調用

// promise可以捕獲錯誤

// 常和定時器一起使用

// new Promise (() => {

//   console.log('支援promise')

// })

// let pro = new Promise(() => {})

// console.log(pro)

let randomPromise = function () {

  let randNum = Math.random() * 2

  console.log(randNum)

  if(randNum < 1) {

    setTimeout(() => {

      console.log('Success Done')

    }, randNum)

  } else {

    console.log('Failed')

  }

}

let log = function (msg) {

  console.log(msg)

}

// function test(resolve, reject) {

//     var timeOut = Math.random() * 2;

//     console.log('set timeout to: ' + timeOut + ' seconds.');

//     setTimeout(function () {

//         if (timeOut < 1) {

//             console.log('call resolve()...');

//             resolve('200 OK');

//         }

//         else {

//             console.log('call reject()...');

//             reject('timeout in ' + timeOut + ' seconds.');

//         }

//     }, timeOut * 1000);

// }

// randomPromise()

// test()

// var p1 = new Promise(test);

// var p2 = p1.then(function (result) {

//     console.log('成功:' + result);

// });

// var p3 = p2.catch(function (reason) {

//     console.log('失敗:' + reason);

// });

let emotion = 'ff'

let happyOrNot = function (resolve, reject) {

  if(emotion == 'happy') {

    resolve('I am very happy')

  } else {

    reject('I am very sad')

  }

}

// let promiseTest = new Promise(happyOrNot)

// let promiseThen = promiseTest.then(res => {

//   console.log('成功呢:' + res)

// }).catch(err => {

//   console.log('完蛋了:' + err)

// })

// 0.5秒後傳回input*input的計算結果:

// function multiply(input) {

//     return new Promise(function (resolve, reject) {

//         log('calculating ' + input + ' x ' + input + '...');

//         setTimeout(resolve, 500, input * input);

//     });

// }

//

// // 0.5秒後傳回input+input的計算結果:

// function add(input) {

//     return new Promise(function (resolve, reject) {

//         log('calculating ' + input + ' + ' + input + '...');

//         setTimeout(resolve, 500, input + input);

//     });

// }

//

// var p = new Promise(function (resolve, reject) {

//     log('start new Promise...');

//     resolve(123);

// });

//

// p.then(multiply)

//  .then(add)

//  .then(multiply)

//  .then(add)

//  .then(function (result) {

//     log('Got value: ' + result);

// });

function first (text) {

  return new Promise((resolve, reject) => {

    let msg = '1 the text is:' + text

    setTimeout(resolve, 500, msg)

  })

}

function second (text) {

  return new Promise((resolve, reject) => {

    let msg = '2 the second text is:' + text

    setTimeout(resolve, 500, msg)

  })

}

function third (text) {

  return new Promise((resolve, reject) => {

    let msg = '3 the third text is:' + text

    setTimeout(resolve, 500, msg)

  })

}

let final = new Promise((resolve, reject) => {

  console.log('start')

  resolve('我在人民廣場吃炸雞')

})

// final.then(first).then(second).then(third).then(res => {

//   console.log('最後的結果是:')

//   console.log(res)

// })

let one = new Promise((resolve, reject) => {

  console.log('one 1')

  setTimeout(resolve, 500, 'one')

})

let two = new Promise((resolve, reject) => {

  console.log('two 2')

  setTimeout(resolve, 500, 'two')

})

Promise.all([one, two]).then(res => {

  // 同時執行好幾個方法

  console.log('all')

  console.log(res)

})

Promise.race([one, two]).then(res => {

  // 容錯,有一個結束就算完成

  console.log('all')

  console.log(res)

})

// async 傳回的是promise對象

// async和await一起用,解決回調套層級問題

function getResult (num) {

  return new Promise((resolve, reject) => {

    setTimeout(() => {

      resolve(2 * num)

    }, 2000)

  })

}

async function gotResult () {

  let result = await getResult(8)

  let result2 = await getResult(3)

  let result3 = await getResult(7)

  let finalResult = result + result2 + result3

  console.log(finalResult)

  return new Promise ((resolve, reject) => {

    setTimeout(() => {

      resolve(result * 2)

    }, 2000)

  })

}

gotResult().then(res => {

  console.log(res)

})