回答編集履歴

4

表現の修正

2019/11/05 13:55

投稿

think49
think49

スコア18189

test CHANGED
@@ -56,7 +56,7 @@
56
56
 
57
57
  変数名を一つの名前で固定すると、関数と変数の間に**依存関係**が出来ます。
58
58
 
59
- 変数のスコープは出来るだけ狭くし、参照透過性を持つ設計にするより可搬性/汎用性のコードなります。
59
+ 変数のスコープは出来るだけ狭くし、参照透過性を持つ設計にするのが、可搬性/汎用性の観点から好ましいと感じます。
60
60
 
61
61
 
62
62
 

3

表現の修正

2019/11/05 13:55

投稿

think49
think49

スコア18189

test CHANGED
@@ -60,7 +60,7 @@
60
60
 
61
61
 
62
62
 
63
- ### data-* + event.data
63
+ ### data-*属性 + event.data
64
64
 
65
65
 
66
66
 

2

data-* + event.data

2019/11/05 13:52

投稿

think49
think49

スコア18189

test CHANGED
@@ -26,4 +26,78 @@
26
26
 
27
27
 
28
28
 
29
+ ### 引数を減らす
30
+
31
+
32
+
33
+ > ```JavaScript
34
+
35
+ > function sample (cls) {
36
+
37
+ > $("."+cls).on('click',function(){
38
+
39
+ > (a[cls]).push(/*something*/)
40
+
41
+ > })
42
+
43
+ > }
44
+
45
+ > ```
46
+
47
+
48
+
49
+ クラス名と変数名(プロパティ名)を一つの変数にまとめて、引数を減らす設計は良いとは思いません。
50
+
51
+ クラス名と変数名は別の概念であり、同じ名前にする必然性はありません。
52
+
53
+ 同じ名前にしてしまうと、後で変数名を変えた時にクラス名まで変えなくてはなりません。
54
+
55
+
56
+
57
+ 変数名を一つの名前で固定すると、関数と変数の間に**依存関係**が出来ます。
58
+
59
+ 変数のスコープは出来るだけ狭くし、参照透過性を持つ設計にすると、より可搬性/汎用性の高いコードとなります。
60
+
61
+
62
+
63
+ ### data-* + event.data
64
+
65
+
66
+
67
+ ```HTML
68
+
69
+ <input type="button" class="sample" value="push1" data-index="0">
70
+
71
+ <input type="button" class="sample" value="push2" data-index="1">
72
+
73
+ <input type="button" class="sample" value="push3" data-index="2">
74
+
75
+ <script>
76
+
77
+ 'use strict';
78
+
79
+ function handleClick (event) {
80
+
81
+ console.log(event.data[jQuery(event.target).data('index')]);
82
+
83
+ }
84
+
85
+
86
+
87
+ function addClickHandler (selectorText, data, handler) {
88
+
89
+ jQuery(selectorText).on('click', data, handler);
90
+
91
+ }
92
+
93
+
94
+
95
+ addClickHandler('.sample', ['sample1','sample2','sample3'], handleClick);
96
+
97
+ </script>
98
+
99
+ ```
100
+
101
+
102
+
29
103
  Re: SugiuraY さん

1

表現の修正

2019/11/05 13:51

投稿

think49
think49

スコア18189

test CHANGED
@@ -1,4 +1,8 @@
1
+ ### event.data
2
+
3
+
4
+
1
- イベントハンドに値を渡すだけなら、`event.data` が用意されています。
5
+ イベントハンドラ関数に値を渡すのであればjQueryには `event.data` が用意されています。
2
6
 
3
7
 
4
8