のくす牧場
コンテンツ
牧場内検索
カウンタ
総計:127,598,373人
昨日:no data人
今日:
最近の注目
人気の最安値情報

私的良スレ書庫

不明な単語は2ch用語を / 要望・削除依頼は掲示板へ。不適切な画像報告もこちらへどうぞ。 / 管理情報はtwitter
ログインするとレス評価できます。 登録ユーザには一部の画像が表示されますので、問題のある画像や記述を含むレスに「禁」ボタンを押してください。

元スレ+ JavaScript の質問用スレッド vol.133 +

JavaScript スレッド一覧へ / JavaScript とは? / 携帯版 / dat(gz)で取得 / トップメニュー
スレッド評価: スレッド評価について
みんなの評価 :
タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。
レスフィルター : (試験中)
←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitter
201 : Name_Not - 2018/04/28(土) 20:35:30.10 ID:???.net (+61,+29,+0)
>>192
なしだろこんなの
意味不明
202 : Name_Not - 2018/04/28(土) 20:38:10.17 ID:???.net (+98,+30,+0)

/nox/remoteimages/b1/0e/8c70c09096dc71be8925155c9e5f.png
203 : Name_Not - 2018/04/28(土) 20:59:34.26 ID:???.net (+22,+29,-49)
他人がどういうコード書こうと批判する気は無いけど

>だとしたら関数にstatic変数を持たせるのに都合がいいですが

これはちょっとわからない
207 : Name_Not - 2018/04/28(土) 22:27:36.73 ID:???.net (+0,-28,-3)
自分はCのstaticの意だと解釈した
208 : Name_Not - 2018/04/28(土) 22:37:23.05 ID:???.net (+25,-29,-22)
>sratic変数は外のスコープから参照可能だが

typoは無視するとして、>>192もそうだがprivateとごっちゃになっている気がする
staticはstatic
209 : Name_Not - 2018/04/28(土) 22:44:14.05 ID:???.net (+57,+29,-16)
妄想に論理性を求めるのは無駄というもの
210 : Name_Not - 2018/04/28(土) 22:52:41.12 ID:???.net (+58,+30,-35)
ふぅ、こんなピリピリした話をしてるなら
いつものようにjQueryの話題で盛り上がっていたほうが良いな
211 : Name_Not - 2018/04/28(土) 22:59:25.11 ID:???.net (+57,+29,-35)
俺はSPAの実際のところが気になる

できるかどうか、難易、フレームワーク云々、以前にSPA必須な案件にまったく遭遇しない
212 : Name_Not - 2018/04/28(土) 23:06:03.45 ID:???.net (+57,+29,-26)
普通のサイトがSPA取り入れても
違和感が出るだけだしな。

クリックしたらページが変わるだろう所で変わらないから
違う、そうじゃないって思っちゃう
213 : Name_Not - 2018/04/28(土) 23:23:14.82 ID:???.net (+57,+29,-23)
そんなもんトランジションアニメーションさせればいいだけの話。
アドレスバーのurlも自由自在よ。
214 : Name_Not - 2018/04/29(日) 00:13:40.97 ID:???.net (+55,+27,-1)
そこまでしてSPAにこだわるメリットがない
215 : Name_Not - 2018/04/29(日) 00:29:00.58 ID:???.net (+73,+29,-41)
>>192
あたまよさそうだねきみ
後学のためにどういう風に使うのか具体的な事例とコードよろしく
216 : Name_Not - 2018/04/29(日) 12:00:52.31 ID:???.net (+38,+7,-1)
>>208
そんなわけないでしょう
privateの意味分かってますか?
217 : Name_Not - 2018/04/29(日) 12:50:16.42 ID:???.net (+53,-30,-215)
>>215
$(document).on('click', '#hoge', function f(e) {
if (!f.fadeout) {
f.fadeout = _.debounce(() => {
$('#moge').fadeOut();
}, 10000);
}
// いろいろな処理
f.fadeout();
});

こんな感じに、関数の中から同一オブジェクトにアクセスしたい場合に使います
fadeout開始するまでの待ち時間に再び呼び出された時には
前回のfadeout予約がキャンセルされるような関数を、lodashのdebounceで作っています
jqueryのdelayとstopで同じことをしようとしたのですが何故かうまくいかなかったので。
これが唯一の実装方法でないのは当然ですが、複雑さを関数の中だけに閉じ込めるのがシンプルで好みです
もっといい方法ありますか?
218 : Name_Not - 2018/04/29(日) 13:30:10.24 ID:???.net (+105,+29,-5)
>>192で言ってることをどこでつかっとんそれ?
219 : Name_Not - 2018/04/29(日) 14:54:33.07 ID:???.net (+3,-30,-120)
イベントは、発行/購読パターンが基本

Mediator もある。
仲介者、まとめ役、橋渡し役、管制塔

イベントキャンセルできるイベントキューのライブラリは、
オライリーの著者などの、外人が作っている

自分で作ったら、複雑すぎて大変

Stoyan Stefanov 著
JavaScriptパターン ―優れたアプリケーションのための作法、2011
オブジェクト指向JavaScript、2012

JavaScriptデザインパターン、Addy Osmani, 2013
220 : Name_Not - 2018/04/29(日) 17:08:55.60 ID:???.net (+51,-30,+0)
setTimeoutの戻り値を自関数の中で管理するだけで済むように見えるんだが、こういう挙動が欲しいのではないのか?

document.getElementById('mybutton').addEventListener( 'click', function f(){
  var delay = 3000;
  if( ( 'timeoutId' in f ) === false )
    f.timeoutId = false;
  if( f.timeoutId !== false )
    clearTimeout(f.timeoutId);
  f.timeoutId = setTimeout( function(){
    f.timeoutId = false;

    /* my oparation */

  }, delay );
}, false );

目印は別にfalseでなくてもいいが
221 : Name_Not - 2018/04/29(日) 17:13:42.83 ID:???.net (+123,+29,+0)
>>218
何を言っているのか分かりません
222 : Name_Not - 2018/04/29(日) 17:15:23.82 ID:???.net (+106,+29,-10)
>>221
関数「名」は、予約&予約キャンセルの仕組みには、一切関係ないではないか
ということだと思うが
223 : Name_Not - 2018/04/29(日) 17:15:50.11 ID:???.net (+96,+29,-29)
>>220
setTimeoutの返り値でキャンセルするっていうのは当たり前の話です
わざわざ複雑にした処理をドヤ顔で書ける神経が分かりません
224 : Name_Not - 2018/04/29(日) 17:16:45.71 ID:???.net (+104,+29,-24)
>>223
目的の挙動はこれで合っているのか間違っているのか、だけが欲しい
225 : Name_Not - 2018/04/29(日) 17:17:08.29 ID:???.net (+78,+29,-4)
>>222
いや、だから何????
そんな話誰してないだろ???
226 : Name_Not - 2018/04/29(日) 17:18:56.35 ID:???.net (+103,+29,-13)
>>224
いやだから、何でわざわざ無駄に複雑にした処理を検討しなきゃいけないの???
甘えすぎじゃね???
227 : Name_Not - 2018/04/29(日) 17:19:32.79 ID:???.net (+13,-29,-74)
>>225
>この関数名は、関数内からしか参照できないのでしょうか?
>だとしたら関数にstatic変数を持たせるのに都合がいいですが、

「関数名」を「参照できる範囲(private性)」について、「だとしたら」で繋いでいるから
228 : Name_Not - 2018/04/29(日) 17:19:55.84 ID:???.net (+79,+27,-5)
・・・・これ複雑か?
229 : Name_Not - 2018/04/29(日) 17:21:24.64 ID:???.net (+90,+29,-26)
質問スレにはままあることですが
回答者に回るレベルに至っていない連中がちょっと回答者に回りすぎでは?
もう少しわきまえて下さい
分かりましたね?
230 : Name_Not - 2018/04/29(日) 17:21:42.89 ID:???.net (+66,+29,-1)
>>226
合っているのだな
231 : Name_Not - 2018/04/29(日) 17:22:11.32 ID:???.net (+68,+29,-1)
>>228
ええ、無駄に複雑ですね。無駄に。
232 : Name_Not - 2018/04/29(日) 17:28:47.28 ID:???.net (+15,-30,-83)
$('#hoge').on('hoge',(e)=>{
console.log('hoge');
});

$(document).trigger('hoge');

このように上位要素でtriggerしても下位の要素で受け取ることは出来ません
上位で受け取ってコールバックするような機構が必要だと思いますが
どうやるのが定石なのでしょうか?
233 : Name_Not - 2018/04/29(日) 17:45:58.89 ID:e1YEqCos.net (+44,+29,-35)
>>221
は?
何を言ってるか分からんてアホ?
>>192で言ってることをどこで使ってるか説明してって言ってるだけなんだが?
使ってないってこと?
234 : Name_Not - 2018/04/29(日) 17:50:40.94 ID:???.net (+68,+29,-50)
>>229
バカが回答をりかいできなくて逆ギレしだすのも質問スレにはよくある
235 : Name_Not - 2018/04/29(日) 17:52:00.36 ID:???.net (+113,+29,-3)
結局>>192をどうつかってるのか分からんだよね
236 : Name_Not - 2018/04/29(日) 17:52:24.38 ID:???.net (+3,-26,-13)
>>232
jqueryスレへどうぞ
237 : Name_Not - 2018/04/29(日) 17:54:55.27 ID:???.net (-2,-30,-15)
> 関数外部からhoge();
> としたらエラーになります

こことかpublic/privateの話だよね
238 : Name_Not - 2018/04/29(日) 18:17:39.97 ID:???.net (+73,+29,-14)
>>235
192はアホすぎて使いようがいない印象をうける
だからこそどうやって使うのかにはかなり興味あるのだがそれは示せないだろう
239 : Name_Not - 2018/04/29(日) 18:19:11.61 ID:???.net (+5,-29,-34)
>>232
意味が分からん。

$(document).trigger('click')ってやったら、
HTMLに含まれる全てのボタンやリンクに対して
クリックされたというイベントを発動させたいのか?
240 : Name_Not - 2018/04/29(日) 23:26:04.99 ID:???.net (+64,+29,-33)
>>217
たしかにどこが複雑なのかも分からん
我流じゃなくて関数型の勉強したほう良いと思う
241 : Name_Not - 2018/04/30(月) 02:27:12.24 ID:???.net (+57,+29,-7)
うっせかす
俺より底辺共が生意気言うなぼけ
242 : Name_Not - 2018/04/30(月) 07:42:58.80 ID:???.net (+84,+26,-36)
簡潔で非ライブラリ依存なコードをあっさり提示されてて草
243 : Name_Not - 2018/04/30(月) 08:54:29.58 ID:???.net (+61,+26,-1)
>>242
何の話?
244 : Name_Not - 2018/04/30(月) 09:26:53.31 ID:???.net (+46,-30,+0)
わからんね。簡素じゃなくて冗長なクソコードなら
>>220にあるけどそれのことかな?w

なにがクソかというと無駄なことしてるから。
clearTimeoutが無効な値を渡しても例外でないのは保証されてるのだから
>>220はこれだけでいい。これがクソコードである根拠
やらなくて良いことをやるのは丁寧なのではなく単に無駄なだけ

document.getElementById('mybutton').addEventListener( 'click', function f(){
  var delay = 3000;
  clearTimeout(f.timeoutId);
  f.timeoutId = setTimeout( function(){
    /* my oparation */
  }, delay );
}, false );

そしてもちろんこれはライブラリを使えば、もっと簡素に実現できる

$('#mybutton').click(_.debounce(function() {
 /* my oparation */
}, 3000));

非ライブラリのコードも簡素に書けないやつが、
ライブラリよりも簡素に書けるとか言わないほうが良い
恥をかくだけだぞw
245 : Name_Not - 2018/04/30(月) 09:38:55.23 ID:???.net (+10,-30,-245)
>>217
単に_.debounceの使い方が良くない

_.debounce は オリジナルのイベントハンドラを
遅延実行機能付のイベントハンドラに変えるもの
と考えたほうが良い

そこに書いたコードは、これだけでいい

$(document).on('click', '#hoge', _.debounce(function() {
  $('#moge').fadeOut();
  // いろいろな処理
}, 3000));

jQueryのstopはよく分からんね。俺もアニメーションはあまり使わないので。
俺が言えることは今はCSSを使ったほうが良いということぐらいだろう

stopだけで単体で実行したらキャンセルされるが、stop().delay()みたいに
続けるとキャンセルできないアニメーションのキュー(?)の絡みの仕様なんだろうけど

ドキュメントにも、setTimeoutを置き換えるものじゃないと書いてあるので
http://api.jquery.com/delay/
setTimeoutをそのまま使うか、lodashでラップされた関数を使うほうが良いのだろう
246 : Name_Not - 2018/04/30(月) 09:41:25.07 ID:???.net (+57,+29,-48)
やっぱり俺がいないとスレのレベルが下がるなw
jQueryを使ったコードだけでなく、
ネイティブのコードもね
247 : Name_Not - 2018/04/30(月) 10:15:48.14 ID:???.net (+95,+29,-100)
>>244
旧泥でclearTimeoutにundefinedを渡すとエラー吐くことがあった気がするが
nullや、あと確かfalseだとエラーを吐かない

LS仕様ではdo nothingと決められていることや
ライブラリではその辺の扱いを別所で定義しているから行数が減ることは間違いない
見て読みやすいコードは無駄ではないことも間違いないとは思うが
248 : 247 - 2018/04/30(月) 10:21:17.97 ID:???.net (+3,-30,-129)
今ちらっとlodashのgithubを見てきたがdebounce.jsのcancelで以下のように確認を入れてから
cancelTimerでclearTimeoutしているところから見ても、少なくとも無駄ではないと思う
というより、事前確認が無駄ならlodashのこの記述も無駄になるような

if (timerId !== undefined) {
cancelTimer(timerId)
}
249 : Name_Not - 2018/04/30(月) 10:27:39.80 ID:???.net (+87,-30,-211)
>>247
そういうことを考慮したとしてもこれだけですむ
冗長なことに変わりはないよ

document.getElementById('mybutton').addEventListener( 'click', function f(){
  var delay = 3000;
  if (f.timeoutId) clearTimeout(f.timeoutId);
  f.timeoutId = setTimeout( function(){
    f.timeoutId = undefined;
    /* my oparation */
  }, delay );
}, false );
250 : 247 - 2018/04/30(月) 10:46:15.44 ID:???.net (+69,+30,-102)
>>249
clearTimeoutに渡す内容の確認はクソコードかつ無駄ではなく必要なものだったと
認めたということで良いかな

初期化は好み次第だと思うけどね
javascriptではプロパティは事前定義しなくてもいいというのは正直どうかと思うところがある
←前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ→ / 要望・削除依頼は掲示板へ / 管理情報はtwitterで / JavaScript スレッド一覧へ
スレッド評価: スレッド評価について
みんなの評価 :
タグ : 追加: タグについて ※前スレ・次スレは、スレ番号だけ登録。駄スレにはタグつけず、スレ評価を。荒らしタグにはタグで対抗せず、タグ減点を。

類似してるかもしれないスレッド


トップメニューへ / →のくす牧場書庫について