web-dev-qa-db-ja.com

Underscore.jsの_.bindAll（）関数の説明が必要

私はいくつかのbackbone.jsを学んでおり、_.bindAll()が使用される多くのインスタンスを見てきました。私は、backbone.jsとunderscore.jsのドキュメントページ全体を読んで、それが何をするのかを理解しようとしましたが、それが何をするのかについてはまだ非常に曖昧です。アンダースコアの説明は次のとおりです。

_.bindAll(object, [*methodNames])

MethodNamesで指定されたオブジェクトにいくつかのメソッドをバインドし、それらが呼び出されるたびにそのオブジェクトのコンテキストで実行されます。イベントハンドラとして使用される関数をバインドするのに非常に便利です。イベントハンドラは、それ以外ではかなり役に立たないthisで呼び出されます。 methodNamesが提供されない場合、オブジェクトのすべての関数プロパティがそれにバインドされます。

var buttonView = {
  label   : 'underscore',
  onClick : function(){ alert('clicked: ' + this.label); },
  onHover : function(){ console.log('hovering: ' + this.label); }
};

_.bindAll(buttonView);

jQuery('#underscore_button').bind('click', buttonView.onClick);
=> When the button is clicked, this.label will have the correct value...

別の例を挙げたり、口頭で説明したりして、ここで手伝うことができれば、何でも歓迎します。さらにチュートリアルや例を検索しようとしましたが、必要なものを提供できるものはありませんでした。ほとんどの人は、それが自動的に行うことを知っているようです...

javascriptbackbone.jsunderscore.js
83
Nik So
_var Cow = function(name) {
    this.name = name;
}
Cow.prototype.moo = function() {
    document.getElementById('output').innerHTML += this.name + ' moos' + '<br>';
}

var cow1 = new Cow('alice');
var cow2 = new Cow('bob');

cow1.moo(); // alice moos
cow2.moo(); // bob moos

var func = cow1.moo;
func(); // not what you expect since the function is called with this===window
_.bindAll(cow1, 'moo');
func = cow1.moo;
func(); // alice moos_
_<div id="output" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>_

残念ながら、実際の「すべてをバインド」機能は、オブジェクトの関数でのみ機能します。プロトタイプで定義された関数を含めるには、_.bindAll()への追加の引数としてそれらの関数名を明示的に渡す必要があります。

とにかく、あなたは説明が必要でした：基本的には、オブジェクトの関数を同じ名前と動作を持つ関数に置き換えることができますが、そのオブジェクトにバインドされているので、メソッドとして呼び出さなくても_this === theObject_ （theObject.method()）。

65
ThiefMaster

私についての最も簡単な説明は次です：

initialize:function () { //backbone initialize function
    this.model.on("change",this.render); //doesn't work because of the wrong context - in such a way we are searching for a render method in the window object  
    this.model.on("change",this.render,this); //works fine
    //or 
    _.bindAll(this,'render');
    this.model.on("change",this.render); //now works fine
    //after  _.bindAll we can use short callback names in model event bindings
}
9
Roman Yudin