JavaScript中Promise对象的基本用法

promise/async

JavaScript 中 Promise 对象的基本用法

const fun = function(num) {
    return new Promise((resolve, reject) => {
        if (num >= 0) return resolve("resolve "+num);
        else return reject("reject "+num);
    });
};

上面构造了一个方法 fun, 方法会返回 Promise 实例,实例的动作是:当参数为非负数时返回 resolve 和数字本身,当参数为负数时返回 reject 和数字本身。

使用then的调用结果

fun(2).then((info)=>{console.log("+++ "+info);}, (info)=>{console.log("--- "+info);});
fun(-3).then((info)=>{console.log("+++ "+info);}, (info)=>{console.log("--- "+info);});
+++ resolve 2
--- reject -3

可以发现当 Promise 对象的状态为 resolved 时,通过 then 当中的第一个匿名函数输出了结果,加上了 +++ 前缀;当状态为 rejected 时,结果通过 then 的第二个匿名函数输出,加上了 — 前缀。

使用catch的调用结果

fun(2).then((info)=>{console.log("+++ "+info);}})
      .catch((info)=>{console.log("000 "+info);});
fun(-3).then((info)=>{console.log("+++ "+info);})
      .catch((info)=>{console.log("000 "+info);});
+++ resolve 2
000 reject -3

可以看出 rejected 状态被 catch 捕捉输出了。

而如果使用 catch 的同时使用 then 的第二个参数

fun(-3).then((info)=>{console.log("+++ "+info);}, (info)=>{console.log("--- "+info);})
      .catch((info)=>{console.log("000 "+info);});
--- reject -3

会发现 catch 没有起作用,因为错误会先被 then 的第二个参数捕捉。

使用finally的调用结果

fun(2).then((info)=>{console.log("+++ "+info);})
      .catch((info)=>{console.log("000 "+info);})
      .finally(()=>{console.log("FFF ");});
+++ resolve 2
FFF

不发生错误的情况会执行 finally 中的内容

fun(-3).then((info)=>{console.log("+++ "+info);})
      .catch((info)=>{console.log("000 "+info);})
      .finally(()=>{console.log("FFF ");});
000 reject -3
FFF

发生错误的情况也会执行 finally 中的内容

async的基本用法

一个例子:假定需要完成这样一个目标,给定数字 num,要求对 num 先执行 num = num+num 再执行 num = num*num

先定义两个对应的方法:

function add(num) {
    return new Promise((resolve, reject) => {
        resolve(num+num);
    });
}

function multiply(num) {
    return new Promise((resolve, reject) => {
        resolve(num*num);
    });
}

用 Promise 的方式:

add(2).then(multiply).then((info)=>{console.log(info);});

用 async 和 await 的方式:

async function run() {
    var result = await multiply(await add(2));
    console.log(result);
}

run()

结果相同,都是 16