直列処理（処理を順番に実行する）の書き方には大きく2通りあります。 このサンプルはrosen.setStationMarker().then()をネストさせていく書き方で、単純な例なら分かりやすいですが、ネストが深くなると 可読性が低くなり、エラー処理も煩雑になります。ある意味Promiseの利点を活かせない書き方です。

var rosen;

function init() {
  rosen = new Rosen("map", {
    apiKey: "2jr5nchcswemrfjj67jvjaqu",  // アクセスキーはサンプル用です。実際にご利用されるときは書き換えてください。
  });
}

// 例3. 直列処理
function btnOnClick() {
  var yuurakucho   = 23036;
  var tokyo        = 22828;
  var ginza        = 22641;
  rosen.setStationMarker(yuurakucho).then(function() {
    alert("ここは有楽町にマーカーが立った後で実行されます。");
    rosen.setStationMarker(tokyo).then(function() {
      alert("ここは東京にマーカーが立った後で実行されます。");
      rosen.setStationMarker(ginza).then(function() {
        alert("ここは銀座にマーカーが立った後で実行されます。");
        throw "エラー"; // この例外は捕捉されません。補足するには、すぐ外側に.catch()をつける必要があります
      });
    });
  }).catch(function(err) {
    alert("エラーが発生しました");
  });
}

window.addEventListener('load', init);
© VAL LABORATORY CORPORATION.