Var Vs Let Javascript

| | |

De nouvelles fonctionnalités ont été ajoutées au langage JavaScript avec la sortie d’ECMAScript6 (ES6). L’une de ces caractéristiques affecte la façon dont nous déclarons les variables. Avec l’ajout de let et const, il y avait toutes sortes de questions sur le moment d’utiliser chacune des déclarations de variables.

Dans cet article, nous parlons de chacune des options, en ce qui concerne leur définition et leur utilisation dans l’environnement JavaScript.

Pré-ES6: Var

Avant la sortie de ES6, le mot - clé utilisé pour les variables était déclaration des var .

Les variables peuvent également être redéclarées et mis à jour sans erreurs

Le premier problème avec var est évident: les redéclarations peuvent provoquer des bugs dans votre code si une variable a déjà reçu le même nom. Il peut y avoir des conséquences inattendues si quelque chose est à nouveau déclaré et que vous ne vous êtes pas rendu compte que le nom de la variable a déjà été utilisé dans la base de code. Parallèlement à cela, d’autres particularités surviennent également en ce qui concerne la portée et le levage.

Portée

La portée nous dit quelles variables sont disponibles pour nous d’utiliser - nous avons des variables qui peuvent être globalement ou localement scope. Et si nous avons la même déclaration variable, mais est globale et l’autre est locale?

Lorsque notre var est déclarée en dehors de la fonction, elle est globalement disponible pour nous globalement. Quand "bonjour" est déclarée dans la fonction, il est disponible uniquement pour la fonction - avec une portée fonctionnelle ou locale

Quand nous avons une déclaration variable qui est la même, mais la portée est différente, le var dans la fonction ne modifie pas l’affectation du var global, même avec l’invocation du helloWorld () . √âtant donné que le var est déclarée dans la fonction avec le nom "bonjour", il ne semble pas à la portée mondiale de l’autre définition.

Hisser

Lorsqu’une variable est hissée en JavaScript, la déclaration des fonctions et des variables est déplacée au début de leur portée avant l’exécution du code. La variable est déclarée mais pas initialisée, donc la valeur initiale de la variable n’est pas définie.

Ici, "bonjour" est hissée et déclarée au sommet de votre portée. Donc, essentiellement, l’ordinateur interprète le code comme ceci:

Le moteur JavaScript voit que hello existe mais ne sait pas comment hello est défini jusqu’à la prochaine étape.

Finalement, les développeurs qui ont aidé à créer la norme ECMAScript ont réalisé qu’il y avait quelques problèmes mineurs avec var qui pourraient leur co√ªter du temps et de l’argent. Ils ont alors décidé de créer des mots-clés plus stricts. Cela a conduit à la création de "laisser" et "co√ªt" dans ES6

ES6:. Soit

Le mot - clé let est très similaire au mot-clé var à bien des égards. Les principales différences sont les erreurs de manière sont renvoyés et la portée de chaque mot - clé est défini.

Variables déclarées et initialisées avec let mot - clé peut être réaffecté, mais ils ne peuvent pas être redéclaré

Lorsque vous exécutez le code ci - dessus dans une console JavaScript, la dernière ligne renvoie une erreur:

SyntaxError: Le identifiant ’bonjour’ a déjà été déclarée

Contrairement à var , la déclaration des variables en utilisant let ne permettra pas une déclaration à la même. Nom de variable. Vous pouvez cependant, réattribuer si vous le souhaitez, comme le montre l’exemple ci - dessus.

Portée

Champ-sage, let est très similaire à var. En plus des règles que nous offre la portée globale ou locale, il y a une contrainte supplémentaire avec let. Les variables déclarées dans un bloc de code ne sont disponibles que pour ce bloc de code. Ceci est similaire à la portée fonctionnelle , car les fonctions sont des blocs de code qui peuvent être portés encore plus loin en ayant des blocs séparés dans cette fonction.

Il n’y a pas d’erreurs dans ce code car les deux les instances de hello sont traitées comme des variables distinctes car elles ont des portées différentes.

Hoisting

Hoisting est un autre domaine o√π les déclarations let et var sont similaires. "Var", lorsqu’il est relevé, est initialisé comme non défini. Toutefois, "congé" génère une erreur de référence si vous essayez de l’ utiliser avant qu’il ne soit initialisé.

Sachez que le mot-clé let est le meilleur choix en termes de syntaxe. En effet, des erreurs sont générées lorsque vous pouvez essayer de redéclarer une variable ou de l’utiliser avant le processus d’initialisation.

ES6: Const

Le mot clé const a lignes guide plus strictes que la let mot - clé . Avec const, les variables ne peuvent pas être déclarées ou réaffectées. Une TypeError est générée si vous essayez de réaffecter à un const.

Cela dit, lorsque vous travaillez avec des objets ou des tableaux, les propriétés de l’objet ou du tableau peuvent être mises à jour. Tant que la structure de base de l’objet ou du tableau ne change pas, vous pouvez toujours la mettre à jour.

Comme le montre l’exemple, réattribuer la t√¢che à un nouvel ensemble de propriétés résultats dans un TypeError: Attribution à variable constante. erreur. Const ne peut être réaffecté ou redéclaré , sauf dans les cas o√π vous mettez à jour la propriété unique dans un objet

Portée et ascenseur

Tout comme le let mot - clé, const est scope bloc et il ne s’initialise pas lorsqu’il est hissé, il générera donc une erreur si vous essayez de l’utiliser avant l’initialisation.

Le mot-clé const est idéal à utiliser jusqu’à ce que vous puissiez ’t " ne pas l’ utiliser plus Ceci est quand vous avez besoin de muter ou de mettre à jour votre variable

Conclusion

Dans cet article, nous avons examiné les différences entre let, var et cost . De tous les mots-clés dont nous disposons actuellement, il est préférable de ne pas utiliser var sauf si nécessaire. Utilisez plutôt let ou const.

Shop

Learn programming in R: courses

$

Best Python online courses for 2022

$

Best laptop for Fortnite

$

Best laptop for Excel

$

Best laptop for Solidworks

$

Best laptop for Roblox

$

Best computer for crypto mining

$

Best laptop for Sims 4

$

Latest questions

NUMPYNUMPY

psycopg2: insert multiple rows with one query

12 answers

NUMPYNUMPY

How to convert Nonetype to int or string?

12 answers

NUMPYNUMPY

How to specify multiple return types using type-hints

12 answers

NUMPYNUMPY

Javascript Error: IPython is not defined in JupyterLab

12 answers

News


Wiki

Python OpenCV | cv2.putText () method

numpy.arctan2 () in Python

Python | os.path.realpath () method

Python OpenCV | cv2.circle () method

Python OpenCV cv2.cvtColor () method

Python - Move item to the end of the list

time.perf_counter () function in Python

Check if one list is a subset of another in Python

Python os.path.join () method