Fonction JavaScript bind()
Emprunt de Fonction
Avec la méthode bind() , un objet peut emprunter une méthode d'un autre objet.
L'exemple ci-dessous crée deux objets (personne et membre).
L'objet membre emprunte la méthode fullname de l'objet personne :
Exemple
const person = {
firstName:"John",
lastName: "Doe",
fullName: function () {
return this.firstName + " " + this.lastName;
}
}
const member = {
firstName:"Hege",
lastName: "Nilsen",
}
let fullName = person.fullName.bind(member); Préserver this
Parfois, la méthode bind() doit être utilisée pour éviter de perdre this .
Dans l'exemple suivant, l'objet personne a une méthode d'affichage. Dans cette méthode, this fait référence à l'objet personne :
Exemple
const person = {
firstName:"John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
}
person.display(); Lorsqu'une fonction est utilisée comme rappel, this est perdu.
Cet exemple essaiera d'afficher le nom de la personne après 3 secondes, mais il affichera undefined à la place :
Exemple
const person = {
firstName:"John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
}
setTimeout(person.display, 3000); La méthode bind() résout ce problème.
Dans l'exemple suivant, la méthode bind() est utilisée pour lier person.display à person.
Cet exemple affichera le nom de la personne après 3 secondes :
Exemple
const person = {
firstName:"John",
lastName: "Doe",
display: function () {
let x = document.getElementById("demo");
x.innerHTML = this.firstName + " " + this.lastName;
}
}
let display = person.display.bind(person);
setTimeout(display, 3000); Qu'est-ce que this ?
En JavaScript, le mot-clé this fait référence à un objet .
Le mot-clé this fait référence à différents objets selon la façon dont il est utilisé :
Seul, this fait référence à l' objet global . |
Dans une fonction, this fait référence à l' objet global . |
Dans une fonction, en mode strict, this est undefined . |
Dans une méthode d'objet, this fait référence à l' objet . |
Dans un événement, this fait référence à l' élément qui a reçu l'événement. |
Des méthodes comme call() , apply() , et bind() peuvent référencer this à n'importe quel objet . |
Remarque
this n'est pas une variable.
this est un mot-clé.
Vous ne pouvez pas changer la valeur de this .