function.prototype.bind()

[versuch13]

Hi, überall wird irgendwie davon gesprochen, prototype.js, was auch gebrauch
von der bind() Methode macht. Ich habe schon einige Artikel darüber gelesen,
dass gerade bind() die Arbeit mit Javascript ja so erleichtern kann usw und
verbessern würde. So auch der Chef, also schaue ich mir dass jetzt mal an,
aber ganz verstehen tue ich es nicht.

Ich habe dieses Beispiel bekommen:

   Function.prototype.bind = function(object) {
    var method = this;
    return function() {
     return method.apply(object, arguments);
    }
   }



   // Beispiel
   function init() {
    this.eigenschaft = 'test';
   }
   
   init.prototype.method = function() {
    this.eigenschaft = this.eigenschaft+' string';
    window.setTimeout(this.update.bind(this), 1000);
   }
   
   init.prototype.update = function() {
    document.getElementById('test').innerHTML = this.eigenschaft;
   }
   
   window.onload = function() {
    var test = new init();
    test.method();
   }

Habe schon viel gesucht und auch einiges gelesen, aber so richtig dahinter
kommen wann das ganze Sinn macht komme ich nicht. Was macht bind()
genau? Hat vielleicht jemand ein Beispiel, an welchem erklärt wird wann es
Sinn macht die Methode zu nutzen, und ein Gegenstück dazu ohne der Methode?

 

[OnlyFoo]

Gegenstück wäre z.B.:

function bla() {
    alert( this.responseText );
}

var xml = new XMLHttpRequest();
xml.onreadystatechange = function() { bla.apply( xml, [] ); };
/* und mit bind: 
 xml.onreadystatechange = bla.bind( xml );
....

Die Funktion bla wird dann so ausgeführt, als wenn sie zum Objekt xml gehören würde, so dass "this" auf das Objekt verweist.
So kannst du zum Beispiel ganz einfach Callback Funktionen registrieren.

Die Methode erzeugt eine Art temporäre Funktion, in der die entsprechende Objekt-Variable gespeichert ist...

Wenn man die bind Funktion erweitert, dann kann man auch Argumente fest an eine Callback Funktion binden... Auch sehr schön...

Noch ein Beispiel:

function MeineKlasse() {
   this.bla = function() { alert( this.maeh ); }
   this.maeh = "test";
}

var muh = new MeineKlasse();
muh.maeh = "hallo";

window.setTimeout( muh.bla.bind( muh ), 1000 ); // funktioniert, gibt hallo aus
window.setTimeout( muh.bla, 1000 ); // funktioniert nicht, gibt vermutlich den fehler aus, dass this.maeh nicht definiert ist. vllt "undefined"

google mal nach "closure" (glaub ich)