teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

8

background: yellow;

2018/04/15 09:06

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -87,7 +87,7 @@
87
87
  }
88
88
 
89
89
  .c {
90
- background: yello;
90
+ background: yellow;
91
91
  }
92
92
 
93
93
  .d {

7

d

2018/04/15 09:06

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -90,7 +90,7 @@
90
90
  background: yello;
91
91
  }
92
92
 
93
- .c {
93
+ .d {
94
94
  background: green;
95
95
  }
96
96
  ```

6

a

2018/04/15 09:05

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -60,4 +60,63 @@
60
60
  console.log(hoge.next().value) //d
61
61
  console.log(hoge.next().value) //a
62
62
  console.log(hoge.next().value) //b
63
+ ```
64
+
65
+
66
+ # 追記 (使い方のイメージ)
67
+
68
+ [https://codepen.io/anon/pen/aYgKgz
69
+ ](https://codepen.io/anon/pen/aYgKgz)
70
+ ```
71
+ <div id='target' class=''></div>
72
+ ```
73
+
74
+ ```
75
+ #target {
76
+ width: 100px;
77
+ height: 100px;
78
+ border: solid 1px #000000;
79
+ }
80
+
81
+ .a {
82
+ background: red;
83
+ }
84
+
85
+ .b {
86
+ background: blue;
87
+ }
88
+
89
+ .c {
90
+ background: yello;
91
+ }
92
+
93
+ .c {
94
+ background: green;
95
+ }
96
+ ```
97
+
98
+ ```
99
+ function foo(list) {
100
+ var i = 0;
101
+ var max = list.length;
102
+ return function baz() {
103
+ if (i >= max) {
104
+ i = 0;
105
+ }
106
+ return list[i++];
107
+ }
108
+ }
109
+
110
+ const hoge = foo(['a', 'b', 'c', 'd']);
111
+
112
+
113
+ var $target = document.getElementById('target');
114
+
115
+ $target.addEventListener('mousedown',function(){
116
+ this.className = hoge();
117
+ });
118
+
119
+ $target.addEventListener('mouseup',function(){
120
+ this.className = hoge();
121
+ });
63
122
  ```

5

lazexさんのコメントを反映

2018/04/15 09:02

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -30,11 +30,9 @@
30
30
  function* foo(list) {
31
31
  let i = 0;
32
32
  const max = list.length;
33
-
34
33
  while (i < max) {
35
34
  yield list[i++];
36
35
  }
37
-
38
36
  yield* foo(list);
39
37
  }
40
38
 
@@ -45,4 +43,21 @@
45
43
  console.log(hoge.next().value) //d
46
44
  console.log(hoge.next().value) //a
47
45
  console.log(hoge.next().value) //b
46
+ ```
47
+
48
+ ## lazexさんからコメント欄で頂いたコード
49
+ ```
50
+ function* foo(list) {
51
+ while(true) {
52
+ yield* list;
53
+ }
54
+ }
55
+
56
+ const hoge = foo(['a', 'b', 'c', 'd']);
57
+ console.log(hoge.next().value) //a
58
+ console.log(hoge.next().value) //b
59
+ console.log(hoge.next().value) //c
60
+ console.log(hoge.next().value) //d
61
+ console.log(hoge.next().value) //a
62
+ console.log(hoge.next().value) //b
48
63
  ```

4

a

2018/04/15 07:44

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -20,7 +20,7 @@
20
20
  console.log(hoge()); //b
21
21
  ```
22
22
 
23
- 質問を読み間違えている可能性はありますが、とりあえず呼び出される度に次のクラス名を返してくれるようなものがあれば良いのかなと思ったので簡易的なものを書いてみました。
23
+ 質問を読み間違えている可能性はありますが、少なくも「このデザインのa1~a4をボタンを押すごとに順に進むようにしたいです。」の行までの説明を読む限では、とりあえず呼び出される度に次のクラス名を返してくれるようなものがあれば良いのかなと思ったので簡易的なものを書いてみました。
24
24
 
25
25
  関数や変数の命名は適当につけましたが、あとはhoge関数をmousedownやmouseupの度に呼んであげればよいのかなと。
26
26
 

3

最後のgeneratorのログ出力のコメントが間違ってたので、そこを修正

2018/04/15 06:17

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -43,6 +43,6 @@
43
43
  console.log(hoge.next().value) //b
44
44
  console.log(hoge.next().value) //c
45
45
  console.log(hoge.next().value) //d
46
- console.log(hoge.next().value) //e
46
+ console.log(hoge.next().value) //a
47
- console.log(hoge.next().value) //f
47
+ console.log(hoge.next().value) //b
48
48
  ```

2

a

2018/04/15 06:04

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -38,11 +38,11 @@
38
38
  yield* foo(list);
39
39
  }
40
40
 
41
- const f = foo(['a', 'b', 'c', 'd']);
41
+ const hoge = foo(['a', 'b', 'c', 'd']);
42
- console.log(f.next().value) //a
42
+ console.log(hoge.next().value) //a
43
- console.log(f.next().value) //b
43
+ console.log(hoge.next().value) //b
44
- console.log(f.next().value) //c
44
+ console.log(hoge.next().value) //c
45
- console.log(f.next().value) //d
45
+ console.log(hoge.next().value) //d
46
- console.log(f.next().value) //e
46
+ console.log(hoge.next().value) //e
47
- console.log(f.next().value) //f
47
+ console.log(hoge.next().value) //f
48
48
  ```

1

a

2018/04/15 05:23

投稿

HayatoKamono
HayatoKamono

スコア2415

answer CHANGED
@@ -22,4 +22,27 @@
22
22
 
23
23
  質問を読み間違えている可能性はありますが、とりあえず呼び出される度に次のクラス名を返してくれるようなものがあれば良いのかなと思ったので簡易的なものを書いてみました。
24
24
 
25
- 関数や変数の命名は適当につけましたが、あとはhoge関数をmousedownやmouseupの度に呼んであげればよいの
25
+ 関数や変数の命名は適当につけましたが、あとはhoge関数をmousedownやmouseupの度に呼んであげればよいのかなと。
26
+
27
+ # ES6対応OKな場合
28
+
29
+ ```
30
+ function* foo(list) {
31
+ let i = 0;
32
+ const max = list.length;
33
+
34
+ while (i < max) {
35
+ yield list[i++];
36
+ }
37
+
38
+ yield* foo(list);
39
+ }
40
+
41
+ const f = foo(['a', 'b', 'c', 'd']);
42
+ console.log(f.next().value) //a
43
+ console.log(f.next().value) //b
44
+ console.log(f.next().value) //c
45
+ console.log(f.next().value) //d
46
+ console.log(f.next().value) //e
47
+ console.log(f.next().value) //f
48
+ ```