Oggetti Javascript che chiamano da soli la funzione

Question

Ho letto Game Design con HTML5 e JavaScript e mi ha fatto conoscere gli oggetti. Quindi, dopo aver letto il libro e lavorato sui progetti, ho deciso di portare questa nuova conoscenza e integrare gli oggetti nei miei progetti. Quindi, ecco la mia domanda può o dovrebbe oggetti chiamare le proprie funzioni? Ad esempio:

var someObject = { 
    start: function() { 
     check(); 
    }, 
    check: function() { 
     console.log("Check!"); 
    } 
}; 

someObject.start(); 

Il libro ha mostrato un esempio con un timer che fa questo:

var timer = { 
    start: function() { 
     var self = this; 
     window.setInterval(function(){self.tick();}, 1000); 
    }, 
    tick: function() { 
     console.log('tick!'); 
    } 
}; 

Nell'esempio con oggetto timer fa riferimento a sé per chiamare la funzione interna, quindi questo significa che dovrei usare io stesso per chiamare le funzioni interne o è questo il modo corretto di farlo con gli oggetti? O le migliori pratiche? Grazie in anticipo.

var someObject = { 
    start: function() { 
     var self = this; 
     self.check(); 
    }, 
    check: function() { 
     console.log("Check!"); 
    } 
}; 

someObject.start(); 

Answer 1

I nomi JavaScript sono lexically scoped, quindi ogni volta che si incontra un nome (variabile) in uno script, il runtime JavaScript deve cercare gli ambiti da cui è stata definita la funzione.

Al punto di definizione, questa funzione:

start: function() { 
    check(); 
} 

non ha accesso a qualsiasi funzione check nel suo ambito esterno. Dichiarare self e legarlo a this è una tecnica utilizzata per gestire il (un po 'interessante) intricacies of referring to the current object in JavaScript (poiché il codice di esempio utilizza window.setInterval).

Per fare riferimento a una funzione nell'oggetto corrente, è sufficiente utilizzare this.

var someObject = { 
    start: function() { 
     this.check(); 
    }, 
    check: function() { 
     console.log("Check!"); 
    } 
}; 

Answer 2

ovviamente un oggetto può e deve chiamare le proprie funzioni, questo è l'unico modo per emulare OOP in javascript. Direi che la pratica che il libro sta usando, self = this non è buona perché lo this può essere usato da solo, tuttavia nel primo esempio viene usato per conservare il valore di ciò che altrimenti sarebbe lo this della funzione stessa non classe esterna

Answer 3

Il punto di dichiarazione e inizializzazione di una variabile come "self" è di occuparsi del fatto che il valore di this viene determinato nuovamente a ogni chiamata di funzione. Quando hai una funzione annidata all'interno di un'altra funzione, e quella funzione interna deve accedere al valore di this dal contesto esterno, quindi this deve essere conservato in un'altra variabile — "self" nel tuo caso. (Il nome di quella variabile non è importante, naturalmente.)

Nel codice di esempio:

var timer = { 
    start: function() { 
     var self = this; 
     window.setInterval(function(){self.tick();}, 1000); 
    }, 
    tick: function() { 
     console.log('tick!'); 
    } 
}; 

che funzione passata a setInterval() ha la necessità di utilizzare il valore della this dalla funzione "start". Quando viene chiamata la funzione di intervallo, tuttavia, this è impostato su qualcos'altro (o il contesto globale o null in modalità "strict"). Pertanto, salvando il valore di this nel contesto in cui viene creata un'istanza di tale funzione, il suo codice può utilizzarlo per accedere all'oggetto timer.

Nel secondo esempio, la dichiarazione e l'inizializzazione di una variabile "self" non danneggia nulla, ma non è necessaria. A volte è utile comunque, solo per chiarire il codice, anche se ovviamente un nome più significativo di "sé" sarebbe una buona idea.

Answer 4

E 'javascript contesto la funzione, ogni volta che si crea una funzione, si crea un nuovo contesto (scope).

In setInterval() funzione si crea un nuovo campo di applicazione, in modo da this riferimento non è più come lo stesso this sopra:

var self = this; 
setInterval(function() { 
    self.tick(); 
}, 1000); 

È possibile anche associare manualmente il giusto contesto della funzione con bind() (quindi non si fa bisogno self più):

setInterval(function() { 
    this.tick(); 
}.bind(this), 1000); 

---

Ulteriori informazioni:

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this
• http://joshuakehn.com/2011/10/20/Understanding-JavaScript-Context.html