Maison interface Web js tutoriel Quelles sont les méthodes de déclaration de variables en JS ?

Quelles sont les méthodes de déclaration de variables en JS ?

Jun 06, 2018 pm 02:45 PM
const js let var

Cette fois, je vais vous montrer quelles méthodes sont disponibles pour déclarer des variables en JS, et quelles sont les précautions à prendre pour déclarer des variables en JS. Ce qui suit est un cas pratique, jetons un coup d'œil.

var x = 0; // x是全局变量,并且赋值为0。
console.log(typeof z); // undefined,因为z还不存在。
function a() { // 当a被调用时,
 var y = 2;  // y被声明成函数a作用域的变量,然后赋值成2。
 console.log(x, y);  // 0 2 
 function b() {    // 当b被调用时,
  x = 3; // 全局变量x被赋值为3,不生成全局变量。
  y = 4; // 已存在的外部函数的y变量被赋值为4,不生成新的全局变量。
  z = 5; // 创建新的全局变量z,并且给z赋值为5。 
 }     // (在严格模式下(strict mode)抛出ReferenceError)
 b();   // 调用b时创建了全局变量z。
 console.log(x, y, z); // 3 4 5
}
a();          // 调用a时同时调用了b。
console.log(x, z);   // 3 5
console.log(typeof y); // undefined,因为y是a函数的本地(local)变量。
Copier après la connexion

Les variables déclarées par let ne sont disponibles que dans le bloc ou le sous-bloc dans lequel elles sont déclarées. La portée de var est l'intégralité de la fonction incluse

function varTest() {
 var x = 1;
 if (true) {
  var x = 2; // 同样的变量!
  console.log(x); // 2
 }
 console.log(x); // 2
}
function letTest() {
 let x = 1;
 if (true) {
  let x = 2; // 不同的变量
  console.log(x); // 2
 }
 console.log(x); // 1
}
Copier après la connexion

Dans ECMAScript 2015. , let liaison Non soumis au levage de variables, ce qui signifie que les déclarations let ne sont pas hissées en haut du contexte d'exécution actuel.
Avant que la variable dans le bloc ne soit initialisée, la référencer provoquera une ReferenceError (au contraire, en utilisant var pour déclarer une variable, la valeur de la variable n'est pas définie)
Lorsqu'elle est utilisée dans un bloc, let apportera la portée de la variable Limitée à ce bloc. Notez que la portée de var est dans la fonction dans laquelle elle est déclarée. La constante

var a = 1;
var b = 2;
if (a === 1) {
 var a = 11; // the scope is global
 let b = 22; // the scope is inside the if-block
 console.log(a); // 11
 console.log(b); // 22
} 
console.log(a); // 11
console.log(b); // 2
Copier après la connexion

const doit spécifier sa valeur au moment de la déclaration. La déclaration

const crée une lecture. seule référence à la valeur. Mais cela ne signifie pas que la valeur qu'elle détient est immuable (par exemple, le contenu de référence est un objet), mais l'identifiant de la variable ne peut pas être réaffecté. Une constante ne peut pas avoir le même nom que d'autres variables ou fonctions dans sa portée

<.>
// 注意: 常量在声明的时候可以使用大小写,但通常情况下全部用大写字母。 
// 定义常量MY_FAV并赋值7
const MY_FAV = 7;
// 报错
MY_FAV = 20;
// 输出 7
console.log("my favorite number is: " + MY_FAV);
// 尝试重新声明会报错 
const MY_FAV = 20;
// MY_FAV 保留给上面的常量,这个操作会失败
var MY_FAV = 20; 
// 也会报错
let MY_FAV = 20;
// 注意块范围的性质很重要
if (MY_FAV === 7) { 
  // 没问题,并且创建了一个块作用域变量 MY_FAV
  // (works equally well with let to declare a block scoped non const variable)
  let MY_FAV = 20;
  // MY_FAV 现在为 20
  console.log('my favorite number is ' + MY_FAV);
  // 这被提升到全局上下文并引发错误
  var MY_FAV = 20;
}
// MY_FAV 依旧为7
console.log("my favorite number is " + MY_FAV);
// 常量要求一个初始值
const FOO; // SyntaxError: missing = in const declaration
// 常量可以定义成对象
const MY_OBJECT = {"key": "value"};
// 重写对象和上面一样会失败
MY_OBJECT = {"OTHER_KEY": "value"};
// 对象属性并不在保护的范围内,下面这个声明会成功执行
MY_OBJECT.key = "otherValue";
// 也可以用来定义数组
const MY_ARRAY = [];
// It's possible to push items into the array
// 可以向数组填充数据
MY_ARRAY.push('A'); // ["A"]
// 但是,将一个新数组赋给变量会引发错误
MY_ARRAY = ['B']
Copier après la connexion

Ce qui suit présente les trois façons de déclarer des variables en JavaScript : var, let et const.

var déclare des variables globales. En d'autres termes, les variables déclarées dans une boucle for peuvent également être utilisées en dehors de la boucle for.

for(var i=0;i&lt;=1000;i++){ 
var sum=0; 
sum+=i; 
} 
alert(sum);
Copier après la connexion
La somme déclarée à l'intérieur de la boucle for peut être utilisée lors de la sortie de la boucle for, et le résultat apparaîtra normalement sans erreur

let : Déclarer des variables au niveau du bloc. , c'est-à-dire des variables locales.

Dans l'exemple ci-dessus, si vous sortez de la boucle for et utilisez à nouveau la variable sum, une erreur sera signalée. Elle a une portée stricte. La variable ne s'applique qu'au bloc de code auquel elle appartient actuellement. La même variable ne peut pas être définie à plusieurs reprises et ne peut pas être déclarée dans Lorsqu'elle est appelée avant, elle doit être définie avant utilisation, et une erreur sera signalée. Vous pouvez utiliser let

dans le corps de la boucle. 'use strict' ; avant de pouvoir utiliser let pour déclarer des variables, sinon les résultats ne seront pas affichés lors de la navigation,

const : utilisé pour déclarer des constantes, a également une portée au niveau du bloc et peut également être déclaré à niveau de bloc.

const PI=3.14;
Copier après la connexion
C'est la même chose que let, et la même variable ne peut pas être définie à plusieurs reprises. Une fois const défini, elle ne peut pas être modifiée.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Utiliser Vue pour définir dynamiquement les paramètres de routage

Explication détaillée des propriétés calculées de Vue et des projets pratiques d'écoute

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Article chaud

Repo: Comment relancer ses coéquipiers
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
3 Il y a quelques semaines By DDD
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌

Tags d'article chaud

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment utiliser JS et Baidu Maps pour implémenter la fonction Map Pan Comment utiliser JS et Baidu Maps pour implémenter la fonction Map Pan Nov 21, 2023 am 10:00 AM

Comment utiliser JS et Baidu Maps pour implémenter la fonction Map Pan

Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Apr 03, 2024 am 11:55 AM

Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS

Outils essentiels pour l'analyse boursière : découvrez les étapes pour dessiner des graphiques en bougies avec PHP et JS Outils essentiels pour l'analyse boursière : découvrez les étapes pour dessiner des graphiques en bougies avec PHP et JS Dec 17, 2023 pm 06:55 PM

Outils essentiels pour l'analyse boursière : découvrez les étapes pour dessiner des graphiques en bougies avec PHP et JS

Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Dec 18, 2023 pm 03:39 PM

Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières

Comment créer un graphique en chandeliers boursiers en utilisant PHP et JS Comment créer un graphique en chandeliers boursiers en utilisant PHP et JS Dec 17, 2023 am 08:08 AM

Comment créer un graphique en chandeliers boursiers en utilisant PHP et JS

Comment utiliser JS et Baidu Maps pour implémenter la fonction de dessin de polygones de carte Comment utiliser JS et Baidu Maps pour implémenter la fonction de dessin de polygones de carte Nov 21, 2023 am 10:53 AM

Comment utiliser JS et Baidu Maps pour implémenter la fonction de dessin de polygones de carte

Comment utiliser JS et Baidu Map pour implémenter la fonction de traitement des événements de clic sur la carte Comment utiliser JS et Baidu Map pour implémenter la fonction de traitement des événements de clic sur la carte Nov 21, 2023 am 11:11 AM

Comment utiliser JS et Baidu Map pour implémenter la fonction de traitement des événements de clic sur la carte

Que fait le nouvel opérateur dans js Que fait le nouvel opérateur dans js Nov 13, 2023 pm 04:05 PM

Que fait le nouvel opérateur dans js

See all articles