teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップECMAScriptに関する質問js array forEach内で走る非同期処理の終了タイミングをひろう方法について

編集履歴

回答編集履歴

8

a

2016/04/15 12:24

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -62,4 +62,18 @@
62
62
  }));
63
63
  console.log('[all done]');
64
64
  })().catch(e => console.error(e));
65
+
66
+ /*
67
+
68
+ coを使うけどよりPromiseやasync/awaitとの親和性を高くして書く場合もこのように
69
+
70
+ co(function* () {
71
+ yield Promise.all(keys.map(value => co(function* () {
72
+ yield sleep(Math.round(Math.random()*10000));
73
+ console.log('done: ' + value);
74
+ })));
75
+ console.log('[all done]');
76
+ }).catch(e => console.error(e));
77
+
78
+ */
65
79
  ```

7

a

2016/04/15 12:24

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -44,3 +44,22 @@
44
44
  }).catch(e => console.error(e));
45
45
  ```
46
46
 
47
+ Babelでコンパイルする前提でasync/awaitを使うなら
48
+
49
+ ```JavaScript
50
+ 'use strict';
51
+
52
+ function sleep(ms) {
53
+ return new Promise(resolve => setTimeout(resolve, ms));
54
+ }
55
+
56
+ const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];
57
+
58
+ (async () => {
59
+ await Promise.all(keys.map(async value => {
60
+ await sleep(Math.round(Math.random()*10000));
61
+ console.log('done: ' + value);
62
+ }));
63
+ console.log('[all done]');
64
+ })().catch(e => console.error(e));
65
+ ```

6

a

2016/04/15 12:15

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -36,10 +36,11 @@
36
36
  const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];
37
37
 
38
38
  co(function* () {
39
- yield keys.map(value => function* () {
39
+ yield keys.map(function* (value) {
40
40
  yield sleep(Math.round(Math.random()*10000));
41
41
  console.log('done: ' + value);
42
42
  });
43
43
  console.log('[all done]');
44
44
  }).catch(e => console.error(e));
45
- ```
45
+ ```
46
+

5

a

2016/04/15 12:11

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -17,7 +17,7 @@
17
17
  Promise.all(keys.map(
18
18
  value => sleep(Math.round(Math.random()*10000)).then(() => console.log('done: ' + value))
19
19
  )).then(
20
- () => console.log('finished'), // すべてresolveされた
20
+ () => console.log('[all done]'), // すべてresolveされた
21
21
  e => console.error(e) // ひとつでもrejectされた，または例外がスローされた
22
22
  );
23
23
  ```
@@ -40,6 +40,6 @@
40
40
  yield sleep(Math.round(Math.random()*10000));
41
41
  console.log('done: ' + value);
42
42
  });
43
- console.log('finished');
43
+ console.log('[all done]');
44
44
  }).catch(e => console.error(e));
45
45
  ```

4

a

2016/04/15 12:05

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -3,6 +3,7 @@
3
3
  - [MDN - Promise.all()](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Promise/all)
4
4
 
5
5
  せっかくなのでES6の機能ふんだんに使って書きます．
6
+ (Node.jsということなので，特にブラウザの互換性のような問題も気にしなくていいと思います)
6
7
 
7
8
  ```JavaScript
8
9
  'use strict';

3

a

2016/04/15 12:00

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -8,14 +8,13 @@
8
8
  'use strict';
9
9
 
10
10
  function sleep(ms) {
11
- return new Promise(r => setTimeout(r, ms));
11
+ return new Promise(resolve => setTimeout(resolve, ms));
12
12
  }
13
13
 
14
14
  const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];
15
15
 
16
16
  Promise.all(keys.map(
17
- value => sleep(Math.round(Math.random()*10000))
18
- .then(() => console.log('done: ' + value))
17
+ value => sleep(Math.round(Math.random()*10000)).then(() => console.log('done: ' + value))
19
18
  )).then(
20
19
  () => console.log('finished'), // すべてresolveされた
21
20
  e => console.error(e) // ひとつでもrejectされた，または例外がスローされた
@@ -30,7 +29,7 @@
30
29
  const co = require('co');
31
30
 
32
31
  function sleep(ms) {
33
- return new Promise(r => setTimeout(r, ms));
32
+ return new Promise(resolve => setTimeout(resolve, ms));
34
33
  }
35
34
 
36
35
  const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];

2

a

2016/04/15 11:58

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -7,17 +7,39 @@
7
7
  ```JavaScript
8
8
  'use strict';
9
9
 
10
+ function sleep(ms) {
11
+ return new Promise(r => setTimeout(r, ms));
12
+ }
13
+
10
14
  const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];
11
15
 
12
- Promise.all(
16
+ Promise.all(keys.map(
13
- keys.map(value => new Promise(
14
- (resolve, reject) => setTimeout(() => {
17
+ value => sleep(Math.round(Math.random()*10000))
15
- console.log('done: ' + value);
18
+ .then(() => console.log('done: ' + value))
16
- resolve(); // ここではすべてresolveする
17
- }, Math.round(Math.random()*10000))
18
- ))
19
- ).then(
19
+ )).then(
20
20
  () => console.log('finished'), // すべてresolveされた
21
- () => console.error('failed') // ひとつでもrejectされた，または例外がスローされた
21
+ e => console.error(e) // ひとつでもrejectされた，または例外がスローされた
22
22
  );
23
+ ```
24
+
25
+ co+Generatorを使うならもう少し見やすくかけますね．
26
+
27
+ ```JavaScript
28
+ 'use strict';
29
+
30
+ const co = require('co');
31
+
32
+ function sleep(ms) {
33
+ return new Promise(r => setTimeout(r, ms));
34
+ }
35
+
36
+ const keys = ['a','b','c','d','e','f','g','h','i','j','k','l'];
37
+
38
+ co(function* () {
39
+ yield keys.map(value => function* () {
40
+ yield sleep(Math.round(Math.random()*10000));
41
+ console.log('done: ' + value);
42
+ });
43
+ console.log('finished');
44
+ }).catch(e => console.error(e));
23
45
  ```

1

a

2016/04/15 11:57

投稿

mpyw
mpyw

スコア5223

answer CHANGED
@@ -11,10 +11,13 @@
11
11
 
12
12
  Promise.all(
13
13
  keys.map(value => new Promise(
14
- resolve => setTimeout(() => {
14
+ (resolve, reject) => setTimeout(() => {
15
15
  console.log('done: ' + value);
16
- resolve();
16
+ resolve(); // ここではすべてresolveする
17
17
  }, Math.round(Math.random()*10000))
18
18
  ))
19
+ ).then(
19
- ).then(() => console.log('finished'));
20
+ () => console.log('finished'), // すべてresolveされた
21
+ () => console.error('failed') // ひとつでもrejectされた，または例外がスローされた
22
+ );
20
23
  ```