JavaScript
promise
非同期処理

javascriptで非同期処理を順番通りに行う場合は、promiseを使うと分かりやすいです。

main.js
//本来やりたいことの一例

//表示
showMessage("処理1開始");  

//処理1
for(int i=0;i<99;i++){

  showMessage("処理中 " + i);  //表示が更新されない

  shori_1(i);
}

//表示
showMessage("処理2開始");  

//処理2
for(int i=0;i<99;i++){

  showMessage("処理中 " + i);  //表示が更新されない

  shori_2(i);
}

上記のサンプルで動作してくれれば問題ないのですが、表示は更新されません。
そこで、下記の様に処理と表示の処理をそれぞれ独立して(非同期で)処理します。
因みに並列処理ではありません(javascriptでは、非同期処理≠並列処理です)。

まとめて書く

まとめて書くとこの様な感じ。

main.js
var promise =    new Promise((resolve, reject) => { condole.log("shori1") })
.then((value) => new Promise((resolve, reject) => { condole.log("shori2") }))
.then((value) => new Promise((resolve, reject) => { condole.log("shori3") }))
.then((value) => new Promise((resolve, reject) => { condole.log("shori4") }))
.then((value) => new Promise((resolve, reject) => { condole.log("shori5") }))
.then((value) => { condole.log("shori6") })
.catch((error) => { condole.log("shoriError") });


値の受け渡し

値の受け渡しは、この様に行います。
rejectすると、直接catchに飛びます。

main.js
var promise = new Promise((resolve, reject) => {

    resolve("para1");
    //reject("error1");

}).then((value) => new Promise((resolve, reject) => { 

    console.log(value);

    resolve("para2");
    //reject("error2");

})).then((value) => new Promise((resolve, reject) => { 

    console.log(value);

    resolve("para3");
    //reject("error3");

})).then((value) => new Promise((resolve, reject) => {

    console.log(value);

    resolve("para4");
    //reject("error4");

})).then((value) => new Promise((resolve, reject) => {

    console.log(value);

    resolve("para5");
    //reject("error5");

})).then((value) => {

    console.log(value);

    resolve("para6");
    //reject("error6");

}).catch((error) => {

 condole.log("error")

});

非同期処理を順番に行う

非同期処理を順番に行う場合は、下記の様に書きます。

main.js
var promise = new Promise((resolve, reject) => {

    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

}).then((value) => new Promise((resolve, reject) => { 

    console.log(value);

    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

})).then((value) => new Promise((resolve, reject) => { 

    console.log(value);

    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

})).then((value) => new Promise((resolve, reject) => {

    console.log(value);


    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

})).then((value) => new Promise((resolve, reject) => {

    console.log(value);

    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

})).then((value) => {

    console.log(value);

    var n = 0;

    while(true){
      window.setTimeout(() => {
        condole.log("処理 " + n);
        if(n==99){
          resolve("para" + n);
          //reject("error" + n);
          break;
        }
        n++;
      }, 1
    }

}).catch((error) => {

 condole.log("error")

});