Modernizrに基づいたさまざまな方法：click vs hover

Question

Modernouserのタッチ/ノータッチ出力に基づいて、.mouseoverと.clickイベントのどちらかを選択できます。

if (Modernizr.touch) { 
    $(el).click(stuff); 
    $(el).click(stuff); 
} else { 
    $(el).mouseover(stuff); 
    $(el).mouseover(stuff); 
} 

しかし、私はそのすべてのことを2度書きたくありません。

if (Modernizr.touch) {correctEvent = click} else {correctEvent = mouseover} 
$(el).correctEvent(stuff); 
$(el).correctEvent(stuff); 

Answer 1

をはい、これは代替オブジェクトアクセスの表記[]で簡単にされています：

var eventName = Modernizr.touch ? 'click' : 'mouseover'; 
$(el)[eventName](stuff); 

ここでは関係事実があることはJavascript機能するので、私はちょうど呼び出すことができるように何かを定義することが可能ですファーストクラスのオブジェクトであるため、他のオブジェクトプロパティと同じ方法でアクセスできます。たとえば、次のようにすることができます。

var foo = { bar: 100 }; 
console.log(foo.bar); 
console.log(foo['bar']); 

2行は事実上同じです。

clickとmouseoverはjQuery選択のプロパティなので、このようにアクセスできます。たとえば、あなたがそう思っていたら、clickメソッドを$(el)['click']()と呼ぶことができます。ポイントはありませんが、あなたはそれを行うことができます。

ここでは、この代替構文を利用して、呼び出す関数が他の要因に依存するケースを処理できます。

編集：詳細については、MDC page on "member operators"を参照してください。