为什么我们在 JavaScript 中使用 then() 方法？

JavaScript 中的then()方法已在 Promise API 中定义，用于处理 API 调用等异步任务。以前使用回调函数代替这个函数，这使得代码难以维护。

句法：

demo().then(
    (onResolved) => {
        // Some task on success
    },
    (onRejected) => {
        // Some task on failure
    }
)

Note: demo is a function that returns a promise prototype.

参数：这个函数有两个参数来处理promise的成功或拒绝：

• onFulfilled：这是一个在Promise成功时调用的函数。这是一个可选参数。
• onRejected：这是一个在拒绝承诺时调用的函数。这是一个可选参数。

返回值：此方法可以返回一个 Promise(如果进一步调用另一个 then())或什么都不返回。

示例 1：不传递参数

JavaScript

    function demo() {
      document.write("Function called!!<br>")
      return Promise.resolve("Success");
      // or
      // return Promise.reject("Failure");
    }
    demo().then()
 

输出：

Function called!!

示例 2：仅传递第一个回调

JavaScript

    function demo() {
      document.write("Function called!!<br>")
      return Promise.resolve("Success");
      // or
      // return Promise.reject("Failure");
    }
    demo().then(
      (message) => {
        document.write("Then success:" + message);
      }
    )

输出：

Function called!!
Then success:Success

请注意，如果演示函数返回一个拒绝，那么它将产生一个错误。

示例 3：传递两个参数

JavaScript

    function demo() {
      document.write("Function called!!<br>")
      return Promise.resolve("Success");
      // or
      // return Promise.reject("Failure");
  
    }
    demo().then(
      (message) => {
        document.write("Then success:" + message);
      },
      (message) => {
        document.write("Then failure:" + message);
      }
    )

输出：

Function called!!
Then success:Success

示例 4：链接多个 then() 方法：每个 then() 都可以返回一个承诺(解决或拒绝)，因此可以将多个 then() 方法链接在一起。

JavaScript

    function demo() {
      document.write("Function called!!<br>")
      return Promise.resolve(1);
      // or
      // return Promise.reject("Failure");
  
    }
    demo().then(
      (value) => {
        document.write(value);
        return ++value;
      },
      (message) => {
        document.write(message);
      }
    ).then(
      (value) => {
        document.write(value);
      },
      (message) => {
        document.write(message);
      }
    )

输出：

Function called!!
12

示例 5：使用 then() 作为异步函数

JavaScript

    var demo = new Promise((resolve, reject) => {
      resolve(1);
    })
    let call = demo.then(
      (value) => {
        console.log(value);
        return ++value;
      },
      (message) => {
        document.write(message);
      });
    console.log(call);
    setTimeout(() => {
      console.log(call);
    });

控制台输出：

Promise {status: "pending"}
1
Promise {status: "resolved", result: 2}