JavaScript(Node.js) で sleep() アラカルト
JavaScript沢志保「sleep() がないんです!」
JavaScript を書く
↓
「この処理が終わったら 1 秒待ってから次の処理に行きたいな」
↓
sleep(1);
↓
ReferenceError: sleep is not defined
↓
(´・ω・`)
ってなったことがあるのはぼくだけでしょうか……。
Ruby にも PHP にも C++ にもあるのに JavaScript にはない sleep()
。
そもそも需要がありそうなのに実装されてないということは暗に使うなと言われているのに等しいような気もするのですが、それでも使いたい人はたくさんいるようで、ググるとたくさん実装方法が出てきます。
そこで今回は様々な方法で sleep()
を実装して、JavaScript 歴1ヶ月ちょいのド素人なりに利点と欠点を考えてみました。
前置き
動作環境
Node.js v7.6.0
sleep() の動作
今回は多数のプログラミング言語に実装されている sleep()
と同様、「指定された秒数だけプログラムを一時停止する関数」を Node.js で実装します。
また、引数にはミリ秒を指定することとします。(例: sleep(2000)
-> 2秒一時停止する)
プログラムの内容
- 「フラ」を出力
-
sleep(1000)
で1秒一時停止 - 「イド」を出力
-
sleep(2000)
で2秒一時停止 - 「チキーン!」を出力して終了
1. setTimeout() だけ使って書いてみる
まずは一番オーソドックスに。
'use strict';
console.log('フラ');
setTimeout(() => {
console.log('イド');
setTimeout(() => {
console.log('チキーン!');
}, 2000);
}, 1000);
メリット
- 5つの中で一番簡単
デメリット
- 入れ子なので処理の流れがわかりづらい
- ネストが深くなるリスク
2. Date() を使って書いてみる
こちらのブログ記事で紹介されていたものです。
'use strict';
console.log('フラ');
sleep(1000);
console.log('イド');
sleep(2000);
console.log('チキーン!');
function sleep(time) {
const d1 = new Date();
while (true) {
const d2 = new Date();
if (d2 - d1 > time) {
return;
}
}
}
メリット
- 簡単
- 処理の流れが同期的に書ける
デメリット
- Date() をひたすら生成し続けるのはどうなんだろう……
3. Promise だけ使って書いてみる
ES6(ES2015) から実装された Promise を使ってみます。
'use strict';
Promise.resolve()
.then(() => {
console.log('フラ');
sleep(1000)
.then(() => {
console.log('イド');
sleep(2000)
.then(() => {
console.log('チキーン!');
Promise.resolve();
})
})
});
function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, time);
});
}
メリット
- 処理の流れが(ある程度は)同期的に書ける
デメリット
- ネストの闇が深すぎる(VSCode で自動整形した結果)
自分の実装が下手なだけな気がするので指摘お願いします……
- IE だと動かない(MDN)
コメントにてご指摘をいただきました、ありがとうございます。
'use strict';
console.log('フラ');
sleep(1000).then(() => {
console.log('イド');
return sleep(2000);
}).then(() => {
console.log('チキーン!');
});
function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, time);
});
}
4. async モジュールを使って書いてみる
Node.js で人気の async モジュールを使います。
'use strict';
const async = require('async');
async.series([
(callback) => {
console.log('フラ');
callback(null);
},
(callback) => {
sleep(1000, () => callback(null));
},
(callback) => {
console.log('イド');
callback(null);
},
(callback) => {
sleep(2000, () => callback(null));
},
(callback) => {
console.log('チキーン!');
callback(null);
}
],
() => { }
);
function sleep(time, callback) {
setTimeout(() => {
callback(null);
}, time);
}
メリット
- 処理の流れが同期的に書ける
デメリット
- Node.js 依存
- いちいちコールバックするのめんどい
5. Promise と async/await で書いてみる
Node v7.6.0 から V8 が v5.5 になりました。(Change Log)
つまり --harmony
しなくても async/await が使える!やったー!
参考: Node.js v7.6.0がリリースされたのでasync/awaitで遊んでみた / Qiita
'use strict';
!async () => {
console.log('フラ');
await sleep(1000);
console.log('イド');
await sleep(2000);
console.log('チキーン!');
}();
function sleep(time) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve();
}, time);
});
}
メリット
- 簡単
- 処理の流れが同期的に書ける
デメリット
- IE はおろか Edge と Safari でも動かない(MDN)
5つ作ってみて
setTimeout() オンリー
→ ちゃちゃっと簡単なものを作りたい時、どのブラウザでも動かしたいとき。
Date()
→ 同上だけどこっちの方が同期的に書けるのでおすすめ。
Promise オンリー
→ うーん……。いまいち利点が見つからない。
async モジュール
→ Node.js 限定。v7.6.0 以前で動いてるなら。
Promise + async/await
→ ES2017 / v7.6.0 以降の Node.js を使えるなら迷わずこれ。
setTimeout() オンリー
→ ちゃちゃっと簡単なものを作りたい時、どのブラウザでも動かしたいとき。
Date()
→ 同上だけどこっちの方が同期的に書けるのでおすすめ。
Promise オンリー
→ うーん……。いまいち利点が見つからない。
async モジュール
→ Node.js 限定。v7.6.0 以前で動いてるなら。
Promise + async/await
→ ES2017 / v7.6.0 以降の Node.js を使えるなら迷わずこれ。
実は元々「async/await ヤッター!」と言いながら 5. を一番最初に作ってみたのがきっかけの記事だったのですが、各ブラウザの対応状況やコードの可読性を考えると今のところは 2. が最適解なのかなぁ……と思いました。
ES2017 の仕様が Edge や Safari でも使えるようになって、async/await で書けるようになるのが待ち遠しいです。
完全に素人目線の記事なので、ご指摘ありましたら何卒よろしくお願いします……。
Author And Source
この問題について(JavaScript(Node.js) で sleep() アラカルト), 我々は、より多くの情報をここで見つけました https://qiita.com/albno273/items/c2d48fdcbf3a9a3434db著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .