JavaScript情報交換所(プログラミング既習者専用） [無断転載禁止]©2ch.net (766ﾚｽ)
JavaScript情報交換所(プログラミング既習者専用） [無断転載禁止]©2ch.net http://mevius.5ch.net/test/read.cgi/tech/1449440793/
上
下
前次
1-
新
通常表示
512ﾊﾞｲﾄ分割
ﾚｽ栞
抽出解除
必死ﾁｪｯｶｰ(本家)
(べ)
自ID
ﾚｽ栞
あぼーん
83: 76 [sage] 2016/04/26(火) 00:48:49.99 ID:74Un+zc0 >>78 > > event.currentTarget === this は相互運用性の為に仕様に取り込まれたに過ぎない > 見た目相互運用できるようには見えないが、 document.all が標準化されたのと同じ理由だが、既存の資産(this で event.currentTarget を参照するコード)を生かす為だ DOM3当時はデファクトスタンダードとして this 値が event.currentTarget を参照していたが、標準化されていなかったので確実に動作する保証がなかった DOM4で標準化された事で既存のコードが確実に動作する事が保証された 単純に相互運用性を考えるなら event.currentTarget を使ったほうが良いのはいうまでもないが、 IE6の影響でXHTMLへの移行が進まなかった教訓を得てバッドノウハウでも積極的に取り入れて互換性を確保する方向にシフトした > > this値に変更されて困る重要なデータを格納する > jQueryは知らないが、これはconstの代りに使うということか？ これは言葉足らずだった、すまん 先述の jQuery.each と同じだ // bad jQuery.each([1, 2, 3], function (i, value) { console.log(this); // Strict Mode なら Number型、sloppy mode なら Object 型 (Function#bind で変更される可変値) }); // good jQuery.each([1, 2, 3], function (i, value) { console.log(value); // 常に Number 型 (Function#bind で変更されない固定値) }); 繰り返し処理をする上で要素の値は固定値でなければならないので this 値を指定すべきではない http://mevius.5ch.net/test/read.cgi/tech/1449440793/83
85: 76 [sage] 2016/04/26(火) 00:51:40.14 ID:74Un+zc0 >>83の続き // bad function fn1 (event) { this.classList.add('hoge'); } // good function fn2 (event) { event.currentTarget.classList.add('hoge'); } element.addEventListener('click', fn1); // OK element.addEventListener('click', fn2); // OK element.addEventListener('click', {handleEvent: fn1}); // NG element.addEventListener('click', {handleEvent: fn2}); // OK handleEventを拡張した場合、this値を指定したコードは動作しなくなる ようするに、this は可変値なので固定値をとりたい場合に使用するべきではないという事だ --- this が可変値である事を上手く利用した例に Array.prototype.forEach がある Array.prototype.forEach.call(document.querySelectorAll('.test'), function (element) { element.classList.add('foo'); }); これが動作するのは Array.prototype.forEach が this 値が配列でなくとも動作するように設計されているからだ this 値は変動するから Function#call や Function#bind が生きる だからこそ、this 値が変動する事に価値を見出せる設計にする必要がある http://mevius.5ch.net/test/read.cgi/tech/1449440793/85
86: 76 [sage] 2016/04/26(火) 01:08:23.70 ID:74Un+zc0 >>80 jQuery でも event.currentTarget で書くことは出来るが、ドキュメントのサンプルコードを読む限りでは作者が this を推奨しているように読める 「許さない」は言いすぎだったかもしれないが、this を推奨するという事は this 値が変更される事を考慮していないのではないか this 値は実行コンテキストに入る時点で決まる不定値であり、this === event.currentTarget になる保証はない https://api.jquery.com/on/ 余談だが、jQuery#each と Array#forEach でコールバック関数の引数順序が違うのは this 束縛がある影響だと考えている jQuery では this で各要素ノードを参照できるので第1引数に element を持っていくと index を参照する為には第2引数まで書かなくてはならない forEach の設計としては直感的ではないが、ショートコーディングの為に index を第1引数に持ってくる歪な修正を加えたようにしか見えない https://api.jquery.com/each/ jQuery('.hoge').each(function (i, element) { console.log(this, i, element); }); http://mevius.5ch.net/test/read.cgi/tech/1449440793/86
87: 76 [sage] 2016/04/26(火) 01:50:16.54 ID:74Un+zc0 >>80 > 事実はあんたが思っているのと正反対だよ。 jQuery#data は優れた機能(ただし、data独自属性の拡張はいただけない)だし、jQuery() のセレクタエンジンは素晴らしいものだった JSON, querySelector 等、優れたライブラリ/先行実装が標準仕様に取り込まれるのはよくある事だ jQuery の全てを否定したいわけではなく、「jQuery の this の使い方が好ましくない」と主張している > そう言う用途として使うのは、DOM要素のdatasetだよ。 dataset は String 型しか格納できない為、jQuery#data の代替にはならない jQuery#data の代替として期待されたのは DOMUserData だが、この API は残念ながら廃止された https://www.w3.org/TR/2004/PR-DOM-Level-3-Core-20040205/core.html#DOMUserData 今では機能的に逆だが、WeakMap が代替となりうるだろう http://www.ecma-international.org/ecma-262/6.0/#sec-weakmap-iterable http://mevius.5ch.net/test/read.cgi/tech/1449440793/87
ﾒﾓ帳
(0/65535文字)
上
下
前次
1-
新
書
関
写
板
覧
索
設
栞
歴
ｽﾚ情報
赤ﾚｽ抽出
画像ﾚｽ抽出
歴の未読ｽﾚ
AAｻﾑﾈｲﾙ
Google検索
Wikipedia
ぬこの手
ぬこTOP
0.036s