Aller au contenu

Le mot-clé var en JavaScript

En JavaScript, la manière dont vous créez et utilisez des variables impacte directement le comportement du code. Le mot-clé var est utilisé depuis des décennies pour déclarer des variables. Ce chapitre explique comment fonctionne var, ses règles de portée et son utilité dans le développement web moderne.

Introduction à la déclaration de variables avec var

Le mot-clé var en JavaScript sert à déclarer une variable, éventuellement en l'initialisant avec une valeur. Les variables déclarées avec var ont une portée fonctionnelle ou globale et sont soumises au hoisting, ce qui peut entraîner des comportements inattendus pour les développeurs venant d'autres langages. plus de détails sur la déclaration de variables

Portée fonctionnelle

Les variables déclarées avec var à l'intérieur d'une fonction sont locales à celle-ci et accessibles n'importe où à l'intérieur. Cette caractéristique de portée fonctionnelle signifie que ces variables, même lorsqu'elles sont déclarées dans un bloc (par exemple, dans une instruction if), sont accessibles dans toute la fonction.


Output appears here after Run.

Hoisting

Le hoisting est un mécanisme JavaScript où les déclarations de variables et de fonctions sont déplacées en haut de leur portée englobante lors de la phase de compilation. Pour les variables déclarées avec var, cela signifie qu'elles peuvent être référencées avant leur déclaration dans le code.


Output appears here after Run.

Dans cet exemple, y est hoisté, donc il est connu dans toute la portée de la fonction mais n'est pas initialisé tant que l'exécution n'atteint pas la déclaration, ce qui entraîne une sortie undefined plutôt qu'une ReferenceError.

Variables globales et le mot-clé var

Lorsque var est utilisé pour déclarer une variable en dehors de toute fonction, elle devient une variable globale, accessible depuis n'importe où dans le code. Dans les environnements de navigateur, cela attache également la variable en tant que propriété à l'objet window, ce qui diffère de let et const. Cependant, cela peut potentiellement entraîner des conflits et des comportements involontaires, en particulier dans les bases de code volumineuses ou complexes.


javascript
var globalVar = "I am global";

Limitations de var et alternatives modernes

Bien que var ait été une partie fondamentale de JavaScript, il présente des limitations qui ont conduit à l'introduction de let et const dans ES6 (ECMAScript 2015), offrant des déclarations de variables à portée de bloc.

Hoisting des variables et confusion de portée

Le comportement de hoisting et la nature à portée fonctionnelle de var peuvent prêter à confusion, en particulier dans les boucles ou les blocs conditionnels, où l'on s'attend intuitivement à des variables à portée de bloc.

Redéclaration avec var et particularités des fermetures dans les boucles

  • Redéclaration : Contrairement à let et const, var permet de redéclarer la même variable dans la même portée sans générer d'erreur.
  • Fermeture dans les boucles : Lorsqu'il est utilisé dans des boucles, var capture la variable de boucle par référence. Cela entraîne souvent des résultats inattendus dans les fermetures (closures) ou les rappels asynchrones, car toutes les itérations partagent la même valeur finale.
Output appears here after Run.

Introduction de let et const

Pour atténuer les problèmes associés à var, let et const offrent aux développeurs des variables à portée de bloc, réduisant les risques d'erreurs liés au hoisting et rendant le code plus prévisible et plus facile à déboguer.

Bonnes pratiques pour utiliser var en JavaScript

Malgré ses limitations, var reste une partie du langage JavaScript et peut encore être rencontré, en particulier dans le code hérité. Respecter les bonnes pratiques garantit que son utilisation n'affecte pas négativement la fonctionnalité ou la maintenabilité du code.

  1. Limiter l'utilisation dans le code moderne : Privilégiez let et const pour les déclarations de variables afin de profiter de la portée de bloc et de réduire les problèmes potentiels de hoisting.
  2. Comprendre la portée : Lors de l'utilisation de var, gardez à l'esprit sa nature à portée fonctionnelle et structurez votre code en conséquence pour éviter les variables globales involontaires.
  3. Initialisation à la déclaration : Initialisez les variables var au moment de leur déclaration pour éviter les valeurs undefined dues au hoisting.

Conclusion

Le mot-clé var a longtemps été une pierre angulaire de JavaScript. Comprendre son comportement en matière de portée et de hoisting est essentiel pour écrire un code fiable. Au fil de l'évolution du langage, let et const ont été introduits pour pallier les limites de var, rendant le JavaScript moderne plus prévisible. Cependant, comprendre var reste indispensable pour maintenir les bases de code héritées. En suivant les bonnes pratiques et en privilégiant les déclarations à portée de bloc, les développeurs peuvent écrire un JavaScript plus propre et plus facile à maintenir.

Pratique

Parmi les affirmations suivantes concernant le mot-clé 'var' en JavaScript, lesquelles sont vraies ?

Trouvez-vous cela utile?

Aperçu dual-run — comparez avec les routes Symfony en production.