bisogno di spiegazione della funzione _.bindAll() da Underscore.js

Question

Ho imparato alcuni backbone.js e ho visto un sacco di casi in cui viene utilizzato _.bindAll(). Ho letto tutta la pagina di documentazione di backbone.js e underscore.js per cercare di capire cosa fa, ma sono ancora molto confuso su ciò che fa. Ecco spiegazione di sottolineatura:

_.bindAll(object, [*methodNames]) 

lega un certo numero di metodi sull'oggetto prescritti dalla methodNames, ad essere eseguito nel contesto di quell'oggetto ogni volta che vengono richiamati. Molto utile il per le funzioni di associazione che vanno a da utilizzare come gestori di eventi, che altrimenti sarebbe invocato con un abbastanza inutile. Se non sono forniti i metodi name , tutte le proprietà della funzione dell'oggetto saranno associate a .

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... 

Se si riesce a dare una mano qui, dando un altro esempio, forse o qualche spiegazione verbale, nulla sarebbe apprezzato. Ho provato a cercare altri tutorial o esempi, ma nil sono arrivati ​​e ho servito quello di cui avevo bisogno. La maggior parte delle persone sembrano conoscere solo ciò che fa automaticamente ...

Answer 1

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>

Purtroppo l'effettiva funzionalità "legare tutto" funziona solo sulle funzioni destro sull'oggetto. Per includere una funzione definita sul prototipo, è necessario passare esplicitamente tali nomi di funzione come argomenti aggiuntivi a _.bindAll().

Ad ogni modo, si voleva una spiegazione: Fondamentalmente consente di sostituire una funzione su un oggetto con una funzione che ha lo stesso nome e il comportamento, ma è anche legato a tale oggetto, in modo da this === theObject anche senza definendolo come un metodo (theObject.method()).

Answer 2

provare questo

<input type="button" value="submit" id="underscore_button"/> 

<script> 
var buttonView = { 
    id  : 'underscore', 
    onClick: function() {console.log('clicked: ' + this.id)}, 
    onHover: function() {console.log('hovering: ' + this.id)} 
} 
_.bindAll(buttonView, 'onClick') 
$('#underscore_button').click(buttonView.onClick) 
$('#underscore_button').hover(buttonView.onHover) 
</script> 

Answer 3

La spiegazione più semplice per quanto mi riguarda è il prossimo:

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 
}