JavaScript
Børre Stenseth
OOP >Binding

Binding

Hva

En av de tingene som det er lett å feile på er binding. Du finner mer om dette på JavaScript Tutorial [1]

Vi skal illustrere poenget med et enkelt eksempel.

En teller

Vi definerer følgende klasse:

_test1.js
// global objects
var c1;
var c2;
// counterclass
function counter(showElementId,waitTime){
    this.show=document.getElementById(showElementId);
    this.delay=waitTime;
    this.counter;
    this.running=false;
    this.step=function(){
        this.show.innerHTML=this.counter;
        this.counter++;
        if(this.running)// NOTE:bind(this)
            setTimeout(this.step.bind(this),this.delay);
    }
    this.start=function(){
        if(this.running)
            return;
        this.counter=0;
        this.running=true;
        this.step();
    }
    this.stop=function(){
        this.running=false;
    }
}

Så lager vi to objekter av denne klassen og kopler dem til hvert sitt element.

x
x

Vi bruker funksjonen bind for å sikre oss at den metoden som kalles etter en timeout er den riktig metoden. Dersom vi ikke gjør dette vil koden vår forsøke å finne funksjonen i window-objektet, siden setTimeout er en metode i nettopp window-objektet. Dette problemet kan løses på mange forskjellige måter, og du finner en drøfting av varianter i JavaScript Tutorial [1] .

Slik binding er nødvendig også i andre situasjoner der vi skal sikre oss at riktig metode involveres.

Referanser
  1. JavaScript Tutorial Ilya Kantor javascript.info/ 03-09-2016
OOP >Binding