teratail
回答率
85.35%
teratail header banner
teratail header banner
質問するログイン新規登録
トップゲーム開発に関する質問1-6までの数字を4枚出したいです。

編集履歴

回答編集履歴

6

テキスト修正

2020/09/20 12:43

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -28,6 +28,8 @@
28
28
 
29
29
  (3) 上記(2) で作った配列に、(1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
30
30
 
31
+ 　　????これによって例えば、`[5, 2, 1, 3, 6, 4]` のような配列が得られる。
32
+
31
33
 
32
34
 
33
35
  (4) 上記(3) で得られた配列の先頭４個による配列を作る。

5

テキスト修正

2020/09/20 12:42

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -6,7 +6,7 @@
6
6
 
7
7
 
8
8
 
9
- - `1`以上`6`以下の自然数が書かれたカードが6枚ある。１枚のカードには一つの数字しか書かれておらず、かつ、6枚のうちのどの２つにも同じ数は書かれていない。そのようなカードから４枚をランダムに取り出し、一列に並べた順列を作りたい。
9
+ - `1`以上`6`以下の自然数が書かれたカードが6枚ある。１枚のカードには一つの数字しか書かれておらず、かつ、6枚のうちのどの２つにも同じ数は書かれていない。そのような6枚のカードから４枚をランダムに取り出し、一列に並べた順列を作りたい。
10
10
 
11
11
 
12
12
 

4

テキスト修正

2020/09/20 12:40

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -120,11 +120,11 @@
120
120
 
121
121
 
122
122
 
123
- (3) 上記 2) で作った配列に、1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
123
+ (3) 上記 (2) で作った配列に、(1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
124
-
125
-
126
-
124
+
125
+
126
+
127
- (4) 上記 3) で得られた配列の先頭４個による配列を作る。
127
+ (4) 上記 (3) で得られた配列の先頭４個による配列を作る。
128
128
 
129
129
 
130
130
 

3

テキスト修正

2020/09/20 12:30

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -26,7 +26,7 @@
26
26
 
27
27
 
28
28
 
29
- (3) 上記(2) で作った配列に、1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
29
+ (3) 上記(2) で作った配列に、(1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
30
30
 
31
31
 
32
32
 

2

テキスト修正

2020/09/20 12:27

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -22,115 +22,153 @@
22
22
 
23
23
 
24
24
 
25
+ (2) 要素として、`1`から`6`までを含む配列 `[1, 2, 3, 4, 5, 6]` を作る。
26
+
27
+
28
+
29
+ (3) 上記(2) で作った配列に、1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
30
+
31
+
32
+
33
+ (4) 上記(3) で得られた配列の先頭４個による配列を作る。
34
+
35
+
36
+
37
+
38
+
39
+ 以下、上記の手順 (1) 〜 (4) を実装していきます。
40
+
41
+
42
+
43
+
44
+
45
+ まず (1) のシャッフルする関数なりメソッドですが、既出の質問でもいくつか投稿されているテーマです。
46
+
47
+
48
+
49
+ - [Javascriptでシャッフルしたい。](https://teratail.com/questions/170508)
50
+
51
+ - [JavaScriptのシャッフル](https://teratail.com/questions/205699)
52
+
53
+
54
+
55
+ 上記も参考にしつつ、シャッフルのアルゴリズムとしてよく使われるのは、[フィッシャー–イェーツのシャッフル](https://ja.wikipedia.org/wiki/%E3%83%95%E3%82%A3%E3%83%83%E3%82%B7%E3%83%A3%E3%83%BC%E2%80%93%E3%82%A4%E3%82%A7%E3%83%BC%E3%83%84%E3%81%AE%E3%82%B7%E3%83%A3%E3%83%83%E3%83%95%E3%83%AB) なので、これを具体的なコードにしたものを探すと、記事でも動画でもたくさんあります。その中で、この回答では以下の動画
56
+
57
+
58
+
59
+ - youtube: [Fisher-Yates Shuffle Modern Algorithm JavaScript Programming Tutorial](https://youtu.be/tLxBwSL3lPQ)
60
+
61
+
62
+
63
+ で説明されている、`Array`のメソッドとして`shuffle`を実装する[コード](https://youtu.be/tLxBwSL3lPQ?t=540) を拝借することにします。（この動画を選んだのは、動画前半の、カードを使ったアルゴリズムの実演が分かりやすいからです）
64
+
65
+
66
+
67
+
68
+
69
+ ```javascript
70
+
71
+ // ???? https://youtu.be/tLxBwSL3lPQ?t=540
72
+
73
+ Array.prototype.shuffle = function() {
74
+
75
+ var i = this.length, j, temp;
76
+
77
+ while(--i > 0) {
78
+
79
+ j = Math.floor(Math.random() * (i+1));
80
+
81
+ temp = this[j];
82
+
83
+ this[j] = this[i];
84
+
85
+ this[i] = temp;
86
+
87
+ }
88
+
89
+ return this;
90
+
91
+ }
92
+
93
+ ```
94
+
95
+
96
+
97
+
98
+
99
+ 次の、
100
+
101
+
102
+
25
103
  (2) 要素として、`1`から`6`までを含む配列を作る。
26
104
 
27
105
 
28
106
 
107
+ は、`const NUMBERS_SIZE = 6;` としておいて、以下で得られます。
108
+
109
+
110
+
111
+ ```javascript
112
+
113
+ [...Array(NUMBERS_SIZE)].map((_e, i) => i+1)　　// => [1, 2, 3, 4, 5, 6]
114
+
115
+ ```
116
+
117
+
118
+
119
+ 次に、
120
+
121
+
122
+
29
123
  (3) 上記 2) で作った配列に、1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
30
124
 
31
125
 
32
126
 
33
- 94) 上記 3) で得られた配列の先頭４個による配列を作る。
34
-
35
-
36
-
37
-
38
-
39
- 以下、上記の手順 (1) 〜 (4) を実装していきます。
40
-
41
-
42
-
43
-
44
-
45
- まず (1) のシャッフルする関数なりメソッドですが、既出の質問でもいくつか投稿されているテーマです。
46
-
47
-
48
-
49
- - [Javascriptでシャッフルしたい。](https://teratail.com/questions/170508)
50
-
51
- - [JavaScriptのシャッフル](https://teratail.com/questions/205699)
52
-
53
-
54
-
55
- 上記も参考にしつつ、シャッフルのアルゴリズムとしてよく使われるのは、[フィッシャー–イェーツのシャッフル](https://ja.wikipedia.org/wiki/%E3%83%95%E3%82%A3%E3%83%83%E3%82%B7%E3%83%A3%E3%83%BC%E2%80%93%E3%82%A4%E3%82%A7%E3%83%BC%E3%83%84%E3%81%AE%E3%82%B7%E3%83%A3%E3%83%83%E3%83%95%E3%83%AB) なので、これを具体的なコードにしたものを探すと、記事でも動画でもたくさんあります。その中で、この回答では以下の動画
56
-
57
-
58
-
59
- - youtube: [Fisher-Yates Shuffle Modern Algorithm JavaScript Programming Tutorial](https://youtu.be/tLxBwSL3lPQ)
60
-
61
-
62
-
63
- で説明されている、`Array`のメソッドとして`shuffle`を実装する[コード](https://youtu.be/tLxBwSL3lPQ?t=540) を拝借することにします。（この動画を選んだのは、動画前半の、カードを使ったアルゴリズムの実演が分かりやすいからです）
64
-
65
-
66
-
67
-
68
-
69
- ```javascript
70
-
71
- // ???? https://youtu.be/tLxBwSL3lPQ?t=540
72
-
73
- Array.prototype.shuffle = function() {
74
-
75
- var i = this.length, j, temp;
76
-
77
- while(--i > 0) {
78
-
79
- j = Math.floor(Math.random() * (i+1));
80
-
81
- temp = this[j];
82
-
83
- this[j] = this[i];
84
-
85
- this[i] = temp;
86
-
87
- }
88
-
89
- return this;
90
-
91
- }
127
+ (4) 上記 3) で得られた配列の先頭４個による配列を作る。
128
+
129
+
130
+
131
+ についてですが、 (1)の`shuffle()`を、Arrayを返すArrayのメソッドとして作ったので、(3)と(4)含む全体をメソッドチェーンとして、以下のように書けます。
132
+
133
+
134
+
135
+
136
+
137
+ ```javascript
138
+
139
+ const NUMBERS_SIZE = 6;
140
+
141
+ const SAMPLING_SIZE = 4;
142
+
143
+
144
+
145
+ const result = [...Array(NUMBERS_SIZE)]
146
+
147
+ .map((_e, i) => i+1)
148
+
149
+ .shuffle()
150
+
151
+ .slice(0, SAMPLING_SIZE);
152
+
153
+
154
+
155
+ console.log(result); // => e.g. [3, 4, 1, 5]
92
156
 
93
157
  ```
94
158
 
95
159
 
96
160
 
97
-
98
-
99
- 次の、
100
-
101
-
102
-
103
- (2) 要素として、`1`から`6`までを含む配列を作る。
104
-
105
-
106
-
107
- は、`const NUMBERS_SIZE = 6;` としておいて、以下で得られます。
108
-
109
-
110
-
111
- ```javascript
112
-
113
- [...Array(NUMBERS_SIZE)].map((_e, i) => i+1)　　// => [1, 2, 3, 4, 5, 6]
161
+ - **動作確認用サンプル：** [codepen.io/jun68ykt/pen/bGpmPGO](https://codepen.io/jun68ykt/pen/bGpmPGO?editors=0012)
114
-
162
+
163
+
164
+
165
+
166
+
115
- ```
167
+ ### 補足
116
-
117
-
118
-
119
- 次に、
168
+
120
-
121
-
122
-
123
- (3) 上記 2) で作った配列に、1)で作った `shuffle()` を適用して、シャッフルされた配列を作る。
169
+
124
-
125
-
126
-
127
- (4) 上記 3) で得られた配列の先頭４個による配列を作る。
170
+
128
-
129
-
130
-
131
- についてですが、 (1)の`shuffle()`を、Arrayを返すArrayのメソッドとして作ったので、(3)と(4)含む全体をメソッドチェーンとして、以下のように書けます。
171
+ 配列やオブジェクトの操作で便利なライブラリ、lodash の [_.sampleSize](https://lodash.com/docs/#sampleSize) を使うと、以下のように、シャッフルする関数やメソッドを用意する必要がなく、手みじかに書けます。
132
-
133
-
134
172
 
135
173
 
136
174
 
@@ -142,56 +180,18 @@
142
180
 
143
181
 
144
182
 
145
- const result = [...Array(NUMBERS_SIZE)]
183
+ const result = _.sampleSize(
146
-
184
+
147
- .map((_e, i) => i+1)
185
+ [...Array(NUMBERS_SIZE)].map((_e, i) => i+1),
148
-
149
- .shuffle()
186
+
150
-
151
- .slice(0, SAMPLING_SIZE);
187
+ SAMPLING_SIZE
188
+
189
+ );
152
190
 
153
191
 
154
192
 
155
193
  console.log(result); // => e.g. [3, 4, 1, 5]
156
194
 
157
- ```
158
-
159
-
160
-
161
- - **動作確認用サンプル：** [codepen.io/jun68ykt/pen/bGpmPGO](https://codepen.io/jun68ykt/pen/bGpmPGO?editors=0012)
162
-
163
-
164
-
165
-
166
-
167
- ### 補足
168
-
169
-
170
-
171
- 配列やオブジェクトの操作で便利なライブラリ、lodash の [_.sampleSize](https://lodash.com/docs/#sampleSize) を使うと、以下のように、シャッフルする関数やメソッドを用意する必要がなく、手みじかに書けます。
172
-
173
-
174
-
175
- ```javascript
176
-
177
- const NUMBERS_SIZE = 6;
178
-
179
- const SAMPLING_SIZE = 4;
180
-
181
-
182
-
183
- const result = _.sampleSize(
184
-
185
- [...Array(NUMBERS_SIZE)].map((_e, i) => i+1),
186
-
187
- SAMPLING_SIZE
188
-
189
- );
190
-
191
-
192
-
193
- console.log(result); // => e.g. [3, 4, 1, 5]
194
-
195
195
  ```
196
196
 
197
197
  - **動作確認用サンプル：** [codepen.io/jun68ykt/pen/zYqmVzN](https://codepen.io/jun68ykt/pen/zYqmVzN?editors=0012)

1

テキスト修正

2020/09/20 12:26

投稿

jun68ykt
jun68ykt

スコア9058

test CHANGED
@@ -14,7 +14,7 @@
14
14
 
15
15
 
16
16
 
17
- ある配列の要素をランダムに入れ換えることを、シャッフル（shuffle)するといいますが、シャッフルを使って、以下の手順1)〜4)によって、ランダムに選ばれた４枚を配列として得ることができます。
17
+ ある配列の要素をランダムに入れ換えることを、シャッフル（shuffle)するといいますが、シャッフルを使って、以下の手順(1)〜(4)によって、ランダムに選ばれた４枚を配列として得ることができます。
18
18
 
19
19
 
20
20