回答編集履歴

2

コード修正

2021/10/21 11:19

投稿

fj68
fj68

スコア752

test CHANGED
@@ -30,15 +30,11 @@
30
30
 
31
31
  const users = [];
32
32
 
33
- const counts = [];
34
-
35
33
 
36
34
 
37
35
  json.values.forEach(value => {
38
36
 
39
37
  users.push(value.userId);
40
-
41
- counts.push(value.count);
42
38
 
43
39
  })
44
40
 
@@ -102,7 +98,7 @@
102
98
 
103
99
  ```js
104
100
 
105
- const getUserIdOf({ userId }) => userId;
101
+ const getUserIdOf = ({ userId }) => userId;
106
102
 
107
103
  const value = { userId: 120, count: 0 };
108
104
 

1

理由を追記

2021/10/21 11:19

投稿

fj68
fj68

スコア752

test CHANGED
@@ -15,3 +15,109 @@
15
15
  細かいことですが、`users`よりも`userIds`の方が適切かな、と思います。
16
16
 
17
17
  ご参考まで。
18
+
19
+
20
+
21
+ ## 追記
22
+
23
+
24
+
25
+ なぜ上記のコードになるのか、一応書いておきます。
26
+
27
+
28
+
29
+ ```js
30
+
31
+ const users = [];
32
+
33
+ const counts = [];
34
+
35
+
36
+
37
+ json.values.forEach(value => {
38
+
39
+ users.push(value.userId);
40
+
41
+ counts.push(value.count);
42
+
43
+ })
44
+
45
+ ```
46
+
47
+
48
+
49
+ まず、`forEach`を`map`に書き換えます。
50
+
51
+ `map`はある配列の要素を順番に取り出し、関数を適用した結果の配列を作ります。
52
+
53
+ やっていることは上のコードと同じでして、`json.values`から要素を1つ(`{ userId: 120, count: 0 }`)順に取り出して「なにかして」その結果を配列にします。
54
+
55
+
56
+
57
+ ```js
58
+
59
+ const users = json.values.map(なにかする関数);
60
+
61
+ ```
62
+
63
+
64
+
65
+ この「なにかする関数」のところが「`{ userId: 120, count: 0 }`から`userId`の値をとってくる」という関数であればいいわけです。
66
+
67
+
68
+
69
+ つまり、こうなります。
70
+
71
+
72
+
73
+ ```js
74
+
75
+ const users = json.values.map(value => value.userId);
76
+
77
+ ```
78
+
79
+
80
+
81
+ ここで、JavaScriptには分割代入という機能があります。
82
+
83
+
84
+
85
+ ```js
86
+
87
+ const value = { userId: 120, count: 0 };
88
+
89
+ const { userId, count } = value;
90
+
91
+ console.log(userId); // 120
92
+
93
+ console.log(count); // 0
94
+
95
+ ```
96
+
97
+
98
+
99
+ これは関数の引数でも使えるので、「`{ userId: 120, count: 0 }`から`userId`の値をとってくる」関数はこうなります。
100
+
101
+
102
+
103
+ ```js
104
+
105
+ const getUserIdOf({ userId }) => userId;
106
+
107
+ const value = { userId: 120, count: 0 };
108
+
109
+ console.log(userIdOf(value)); // 120
110
+
111
+ ```
112
+
113
+
114
+
115
+ あとはこれらを組み合わせれば、冒頭の回答コードになります。
116
+
117
+
118
+
119
+ `filter`も`forEach`も同じようなものです。「なにかをする」関数の部分がちょっと変わるだけです。
120
+
121
+ でもとても便利なので、使えるようになると読みやすいコードが書けるようになると思います。
122
+
123
+ 幾分慣れの部分がありますので、頑張ってください!