Méthodes d'objet JavaScript, "this"
En JavaScript, les objets sont créés pour représenter des entités du monde réel, tels que des commandes, des utilisateurs, et plus encore. Voici un exemple:
Dans le monde réel, vous agissez comme ceci : vous connectez, vous déconnectez, vous choisissez quelque chose dans un panier d'achat, et plus encore.
En JavaScript, vous pouvez représenter des actions par des fonctions dans des propriétés.
Exemples de Méthodes
Votre première étape dans l'étude des méthodes d'objet JavaScript devrait être d'apprendre comment dire "bienvenue". L'exemple ressemblera à cela:
Ainsi, le site ne peut répondre qu'après l'avoir appelé.
Une fonction particulière qui est la propriété d'un objet est connue sous le nom de méthode. Dans l'exemple donné ci-dessus, welcome est une méthode de l'objet site.
De plus, une fonction pré-déclarée peut être utilisée comme une méthode. Pour ce faire, vous devez invoquer la commande suivante:
Description de la Programmation Orientée Objet
La Programmation Orientée Objet (en abrégé “OOP”) vise à écrire des codes en utilisant des objets pour représenter des entités.
OOP peut être décrite comme une science en soi. Beaucoup de recherche a été faite pour explorer pleinement comment choisir les bonnes entités, comment organiser l'interconnexion entre elles, et plus encore. C'est une toute nouvelle architecture.
Raccourci de Méthode
Vous pouvez utiliser une syntaxe courte pour les méthodes d'un objet comme ceci:
Dans cet exemple, vous pouvez voir que le mot “fonction” est omis, et il est simplement écrit welcome. Bien sûr, il peut y avoir des différences liées à l'héritage d'objet. Dans tous les cas, dans la plupart des cas, on préfère utiliser une syntaxe plus courte.
"this" dans les Méthodes d'Objet
Généralement, pour faire son travail, une méthode d'objet doit avoir les informations conservées dans l'objet.
Par exemple, le code qui est à l'intérieur de site.welcome() pourrait avoir besoin du site.name.
Une méthode peut utiliser le mot-clé “this” pour accéder à l'objet.
L'objet “avant le point” devrait être la valeur de “this”.
Par exemple, vous pouvez appeler la méthode comme suit:
Dans l'exemple ci-dessus, lors de l'exécution de site.welcome(), site sera la valeur de “this”.
Vous avez la possibilité d'accéder à l'objet sans utiliser “this”. Il suffit de le référencer via la variable externe comme ceci:
Mais, prenez en compte que ces types de codes peuvent ne pas être fiables. En cas de copie du site vers une variable différente (par exemple, anotherSite = site) en écrasant site avec autre chose, vous serez dirigé vers un mauvais objet.
Voici un exemple:
"this" peut être Non-Lié
Communément, le mot-clé JavaScript “this” peut être utilisé dans n'importe quelle fonction contrairement à d'autres langages de programmation.
L'exemple suivant n'a aucune erreur de syntaxe:
function welcome() {
console.log(this.name);
}
Dans l'exemple suivant, la même fonction est accréditée à 2 objets différents, et elle comprend des “this” distincts dans les invocations:
Donc, des étapes simples sont utilisées ici : Si vous appelez d'abord obj.func(), alors vous devez exécuter this is obj pendant l'invocation de func. Cela signifie que dans l'exemple ci-dessus, soit site soit anotherSite est utilisé.
Invocation sans objet : this == undefined
La fonction peut même être appelée sans un objet comme suit:
Dans l'exemple mentionné ci-dessus, this est undefined en mode strict. Dans le cas où on essaie de entrer this.name, une erreur peut survenir.
La valeur de “this” en mode non strict sera l'objet global.
En général, un appel comme celui-ci peut provoquer une erreur de programmation. S'il y a this dans la fonction, elle devrait être invoquée dans le contexte de l'objet.
Résultats de "this" Non-Lié
Si vous êtes déjà habitué à un autre langage de programmation, il est possible que vous soyez familier avec l'idée de "this lié" dans laquelle les méthodes, caractérisées dans un objet obtiennent toujours “this” faisant référence à l'objet.
“this” peut être décrit comme libre en JavaScript. Par conséquent, sa valeur ne dépend pas de l'endroit où la méthode a été confirmée. Mais cela dépend plus de l'objet "avant le point".
Le concept donné de “this” a à la fois des avantages et des inconvénients. D'une part, vous pouvez utiliser la fonction pour une variété d'objets. D'autre part, plus de flexibilité, plus de chances de faire des erreurs. Votre objectif devrait être d'apprendre à travailler avec lui pour obtenir des avantages et éviter des erreurs.
Les Fonctions Flèches n'ont pas de "this"
Les fonctions flèches sont uniques en ce qu'elles n'ont pas leur propre “this”. Dans le cas où vous commencez à le référencer à partir d'une telle fonction, il sera pris à partir d'une fonction “normal” externe.
Dans l'exemple suivant, arrow() utilise this de la méthode : site.welcome().
La méthode spéciale de fonction flèche est particulièrement utile lorsque vous ne souhaitez pas avoir un "this" séparé mais que vous voulez le prendre d'un contexte extérieur.
Heure du Quiz : Testez Vos Compétences!
Prêt à relever le défi de ce que vous avez appris ? Plongez dans nos quiz interactifs pour approfondir votre compréhension et renforcer vos connaissances de manière ludique.