Promise.prototype.then()

then()メソッドはPromiseを返します。２つの引数を持ち、両方ともPromiseが成功した場合、失敗した場合のコールバック関数です。

構文

p.then(onFulfilled, onRejected);

p.then(function(value) {
   // fulfillment
  }, function(reason) {
  // rejection
});

引数

onFulfilled

Promiseが成功したとき呼ばれるFunction。この関数は１つの引数、valueを持ちます。

onRejected

Promiseが失敗したとき呼ばれるFunction。この関数は１つの引数、reasonを持ちます。

説明

thenメソッドとPromise.prototype.catch()メソッドはプロミスを返して、チェーンされます。 — compositionと呼ばれる操作。

例

then メソッドを使う

var p1 = new Promise(function(resolve, reject) {
  resolve("Success!");
  // or
  // reject ("Error!");
});

p1.then(function(value) {
  console.log(value); // Success!
}, function(reason) {
  console.log(reason); // Error!
});

チェーン

then メソッドはPromiseを返すので、thenの呼び出しを簡単に繋げます。

var p2 = new Promise(function(resolve, reject) {
  resolve(1);
});

p2.then(function(value) {
  console.log(value); // 1
  return value + 1;
}).then(function(value) {
  console.log(value); // 2
});

p2.then(function(value) {
  console.log(value); // 1
});

同様に、別の関数上にプロミスベースのAPIとともに関数を実装することでチェーンを使うこともできます。

function fetch_current_data() {
  // The fetch() API returns a Promise.  This function
  // exposes a similar API, except the fulfillment
  // value of this function's Promise has had more
  // work done on it.
  return fetch("current-data.json").then((response) => {
    if (response.headers.get("content-type") != "application/json") {
      throw new TypeError();
    }
    var j = response.json();
    // maybe do something with j
    return j; // fulfillment value given to user of
              // fetch_current_data().then()
  });
}

仕様

ブラウザ実装状況

関連情報

• Promise
• Promise.prototype.catch()