自分なりの理解メモ
JSでは、処理の順番が書いた順番に担保されない、という問題がある。
下記記事からコードをお借りしました。 https://qiita.com/YoshikiNakamura/items/732ded26c85a7f771a27
処理を待って欲しいが待ってくれない
個人的にすごく理解しやすかった例がこれ。
console.log(1); setTimeout(function(){console.log(2)}, 1000); console.log(3);
処理のイメージとしては、 1, 2, 3の順番に出力して欲しい、と思いながら書くケースが多いと思う。
実際に、そういう書き方をしてしまう。
この例だと、さすがにしないっしょって思うかもしれないが、chrome拡張の chrome.tabs.sendMessage( }, function(response){
なんかを使っているとあるあるだと思う。
上記のような場合を処理を待たせて順番に処理するようにできる
Promiseを利用すると順番を担保、処理を待ってから次の処理に移らせることができる。
例
なので、処理をまってから実行させたい場合などは以下。
関数に切り出して、 return new Promise()させておいて、
test().then( () => {})と書いていく方法もあり。
new Promise(function(resolve, reject) { chrome.tabs.sendMessage(tab.id, { target: "test" }, function(response){ ... // 条件分岐で成功、失敗など。 if (成功) { resolve(); } else { reject(); } }).then(() => { 次の処理 })
うまく動いたかどうか？
処理の順番を追うには、 console.logを適所に仕込んで追ってみるとよかったり。
