質問: 'block'; }, 3000); }, 500); }, 1000); ``` ただ、このような記述が良いものかがわかりません。 下記についてご教授いただけないでしょうか? > > -「setTimeout」を使用した場合の良い記述 > > -「setTimeout」以外でこのような効果を付ける記述 > > > 通常このような効果を付けるにはどのような記述をするのが一般的であるか知りたく思っています。 もしくは生のJavaScriptでこのような効果をつけることはあまり無かったりするのでしょうか?
回答: 個人的には非同期処理を同期処理のようにしたい場合は`Promise`を利用して記述しています。 ※IE11は`Promise`に対応していないので、こちらのpolyfillを読み込むことで同様の処理が可能です。 babelやTypescriptの変換環境があるのであれば、await/asyncを利用すればより簡素に記述できます。 ``` var anime = function (target, delay) { return new Promise(function (resolve, reject) { setTimeout(function () { document .querySelector(target) .setAttribute('class', 'show'); resolve(); }, delay); }); } anime('#text01', 1000) .then(function () { anime('#text02', 500) }) .then(function () { anime('#text03', 3000) }); ```