Metodo di bind JavaScript

In un programma JavaScript, quando si utilizza "Questo"Parola chiave con un metodo e invocarlo da un oggetto ricevitore, a volte"Questo"Non è limitato all'oggetto richiesto e quindi provoca errori. È possibile utilizzare il metodo JavaScript bind () per prevenire questo problema.

IL Metodo JavaScript bind () viene utilizzato per legare le funzioni. Utilizzando questo metodo, è possibile legare un oggetto a una funzione comune per mostrare risultati diversi in base alle tue esigenze. È inoltre possibile utilizzare il metodo bind () per le funzioni di prestito da un altro oggetto.

Questo articolo spiegherà il metodo JavaScript bind () e esempi relativi a Prestito della funzione E Binding della funzione sarà anche dimostrato. Quindi iniziamo!

Metodo JavaScript bind ()

Il metodo JavaScript bind () salva il contesto dei parametri correnti e "Questo"Per l'esecuzione futura. Di solito mantiene il contesto di esecuzione di una funzione che funziona in un contesto diverso.

In caso di Binding della funzione, Il metodo bind () crea a Nuova funzione Avere la copia esatta del corpo della funzione originale. Il valore di "Questo"La parola chiave viene passata come primo parametro nel metodo bind () e può anche assumere ulteriori argomenti per l'associazione. Mentre, in Prestito della funzione, Il metodo JavaScript bind () prestiti IL funzione di un altro oggetto senza fare la sua copia.

Sintassi del metodo JavaScript bind ()

Dai un'occhiata alla sintassi del metodo JavaScript bind ():

funzione.Bind (thyarg, [arg1], [arg2], ...);

Qui, il "thyarg"Rappresenta"Questo"Parola chiave e “[Arg1], [Arg2], .. "Sono gli argomenti aggiuntivi. Il metodo Dato JavaScript bind () restituirà una nuova funzione quando viene invocato e anche impostato "Questo"Al valore specificato.

Esempio 1: usando il metodo JavaScript bind () per il legame a funzione singola
Prima di tutto, creeremo un semplice programma che comprende un "dipendente"Oggetto. IL "dipendente"L'oggetto ha un"nome"Proprietà e un"showinfo ()" metodo:

Let Employee =
Nome: "Jack Smith",
showinfo: function ()
console.registro (questo.nome);

;

IL "Questo"Parola chiave aggiunta in"showinfo ()Il metodo "legato il"nome"Variabile alla funzione quindi accedere"Jack Smith"Come nome di un dipendente non è un problema. Questo processo è noto come vincolo predefinito in JavaScript:

dipendente.showInfo ();

L'esecuzione del programma di cui sopra mostra il seguente output:

Ora creeremo una nuova funzione variabile, "showinfo2"Questo si riferisce al"showinfo ()"Funzione dell'oggetto dipendente. In questo caso, l'associazione predefinita andrà perso e il programma non mostrerà alcun output:

var showinfo2 = dipendente.showinfo;
showinfo2 ();

Quindi, quando il callback "dipendente.showinfo"È invocato, il"nome"La proprietà non esiste nell'oggetto globale ed è impostata su"non definito"Come mostrato nell'output:

È possibile utilizzare il metodo JavaScript bind () per garantire che qualsiasi legame correlato a "Questo"La parola chiave non è persa. Il metodo bind () imposta il contesto "questo" sull'oggetto specificato:

Let Employee =
Nome: "Jack Smith",
showinfo: function ()
console.registro (questo.nome);

;

Qui il metodo JavaScript bind () crea una nuova funzione con "Questo"Parola chiave che si riferisce al parametro tra parentesi. Ci consente inoltre di invocare il "showinfo ()"Funzione mentre passa il"dipendente"Oggetto come argomento:

var showinfo2 = dipendente.showinfo.Bind (dipendente);
showinfo2 ();

Il metodo showinfo2 () visualizzerà il assegnato "nome" Di "dipendente"Oggetto:

Esempio 2: usando il metodo JavaScript bind () per il legame più funzioni
Nel seguente esempio, creeremo tre oggetti: "dipendente1","dipendente2", E "dipendente3":

let Employee1 =
Nome: 'Jack';
let Employee2 =
nome: 'max';
let Employee3 =
Nome: 'Paul';
funzione showinfo ()
console.registro (questo.nome);

Per ciascuno degli oggetti di cui sopra, invoceremo il "showinfo ()"Metodo utilizzando il JavaScript"legamento()" metodo:

var showinfo2 = showinfo.Bind (Employee1);
showinfo2 ();
var showinfo3 = showinfo.Bind (Employee2);
showinfo3 ();
var showinfo4 = showinfo.Bind (Employee3);
showinfo4 ();

L'output visualizzerà i valori della proprietà del nome di "dipendente1","dipendente2", E "dipendente3"Oggetti:

Esempio 3: usando il metodo JavaScript bind () per il prestito delle funzioni
Con l'aiuto del metodo JavaScript bind (), un oggetto può prendere in prestito una funzione di un altro oggetto aggiunto. Per la dimostrazione, creeremo due oggetti "auto" E "aereo" avendo "nome" proprietà, "correre()" E "volare()"Metodi rispettivamente:

let car =
Nome: 'Auto',
run: function (velocità)
console.registro (questo.nome + 'si muove a' + velocità + 'mph.');

;
let Airplane =
Nome: "Airplane",
fly: function (velocità)
console.registro (questo.nome + 'sta volando a' + velocità + 'mph.');

;

Ora, se vuoi il "aereo"Oggetto a correre, Quindi utilizzare il metodo JavaScript bind () per la creazione di una funzione run () con “Questo"Parola chiave, che la imposta su"aereo"Oggetto:

Let run = auto.correre.Bind (aereo, 20);
correre();

Abbiamo chiamato il bind () con l'auto.metodo run () e superato "aereo" COME "nome"Valore della proprietà e la sua velocità di"20":

L'output di cui sopra indica che usando il metodo JavaScript bind (), abbiamo preso con successo il correre() metodo dal auto oggetto, senza fare la sua copia.

Conclusione

IL Javascript bind () Il metodo salva il contesto dei parametri attuali e "Questo"Per l'esecuzione futura. Di solito mantiene il contesto di esecuzione di una funzione che funziona in un contesto diverso. Può essere utilizzato per il legame della funzione e il prestito della funzione. Questo articolo ha spiegato il metodo JavaScript Bind () e sono dimostrati anche esempi relativi al prestito della funzione e al legame delle funzioni.