JavaScript .chiamare() .applicare() e .bind () – explained to a total noob

JavaScript ha una serie di funzioni/metodi integrati che possono essere applicati a vari tipi di dati.

Proprio come .split(“”) può applicarsi a una stringa,.chiamare(), .applicare() e .bind () sono metodi di funzioni.

Queste 3 funzioni sono tutte progettate per impostare il CONTESTO, o più specificamente, a cosa si riferisce “questo”.

La maggior parte delle volte, definisci sempre “questo” o lo includi specificamente in una funzione., Per esempio, diciamo che hai un oggetto:

var owen = { name: "Owen"}

E si desidera fare riferimento a questo oggetto con una funzione:

function sayTo(person, first, second){ return first + " " + person.name + " " + second;}sayTo(owen, "Hi", "how are you?");
//returns "Hi Owen how are you?"

Ora, se richiamato il sayTo funzione di Owen, con 2 argomenti, si sarebbe invocare correttamente, perché

Ora, che cosa se sayTo è stato definito un po ‘ diverso?

Il primo argomento, owen, va alla prima variabile, ” hi “va alla seconda variabile e” come stai?”non va da nessuna parte, e this.name non è definito, perché questo NON è l’oggetto owen.

Questo quando si console.,registralo, restituisce effettivamente l’oggetto della finestra globale.

Utilizzando .chiamata ()

.call () consente alla funzione sayTo di funzionare:

La notazione è la seguente:

functionName.call(value of this, arg1, arg2…)

.la chiamata essenzialmente forza il valore in questo in qualsiasi funzione .chiamata viene applicata su. In questo caso, invochiamo la funzione sayTo. .call (owen, owen) costringe questo di sayTo () ad essere l’oggetto owen. Quindi this.name è applicabile.

“Ciao” e ” come stai?”sono inseriti come secondo o terzo argomento della funzione sayTo (che richiede 2 argomenti).

Utilizzando .applicare ()

Utilizzando .,apply() è molto simile a .chiamare. L’unica differenza è che .call () prende arg1 e arg2 uno dopo l’altro.

Per .apply () per funzionare, gli argomenti 1 e 2 devono essere inseriti come array:

Il formato è il seguente:

functionName.apply(value of this, )

Si noti che arg1 e arg2 sono inseriti come array.

Utilizzando .bind ()

.bind (), a differenza .applicare() e .call(), restituisce una funzione invece di un valore.

.bind () imposta il valore di questo e cambia la funzione in una nuova funzione, ma non invoca la funzione.,

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayToOwen = sayTo.bind(owen);

In sostanza, sayToOwen è creato come una nuova funzione. Che è techincally:

var sayToOwen = function(first, second){ return first + " " + owen.name + " " + second;}

È quindi possibile eseguire sayToOwen come una funzione normale.

Puoi anche “associare” anche gli argomenti di sayTo ():

var owen = {name: "Owen”}function sayTo(first, second){return first + " " + this.name + " " + second;}var sayHiToOwen = sayTo.bind(owen, "Hi");

La variabile sayHiToOwen diventa quindi:

var SayHiToOwen = function(second){
return "Hi" + " " + owen.name + " " + second;}

Riepilogo

Leave a Comment