Maison >interface Web >Questions et réponses frontales >Quelle est la différence entre let et var dans es6
Différences : 1. les variables let ont une portée au niveau du bloc, tandis que les variables var n'ont pas de portée au niveau du bloc ; 2. les variables var ont une promotion de variable (pas de contraintes de zone morte temporaire) et peuvent être utilisées d'abord puis déclarées, tandis que let les variables n'existent pas. La promotion des variables (avec des contraintes de zone morte temporaires) doit être déclarée avant utilisation ; 3. Les variables Let ne peuvent pas être déclarées à plusieurs reprises, mais les variables var le peuvent.
L'environnement d'exploitation de ce tutoriel : système Windows 7, ECMAScript version 6, ordinateur Dell G3.
ES6 ajoute une nouvelle commande let
pour déclarer les variables locales. Son utilisation est similaire à var
, mais la variable déclarée n'est valide que dans le bloc de code où se trouve la commande let
(portée au niveau du bloc), et il existe une contraintes de zone morte. let
命令,用来声明局部变量。它的用法类似于var
,但是所声明的变量,只在let
命令所在的代码块内有效(块级作用域),而且有暂时性死区的约束。
先看个var
的常见变量提升的面试题目:
题目1: var a = 99; // 全局变量a f(); // f是函数,虽然定义在调用的后面,但是函数声明会提升到作用域的顶部。 console.log(a); // a=>99, 此时是全局变量的a function f() { console.log(a); // 当前的a变量是下面变量a声明提升后,默认值undefined var a = 10; console.log(a); // a => 10 } // 输出结果: undefined 10 99
如果以上题目有理解困难的童鞋,请系统的看一下老马的免费JS高级视频教程。
ES6可以用let定义块级作用域变量
在ES6之前,我们都是用var来声明变量,而且JS只有函数作用域和全局作用域,没有块级作用域,所以{}
限定不了var声明变量的访问范围。
例如:
{ var i = 9; } console.log(i); // 9
ES6新增的let
,可以声明块级作用域的变量。
{ let i = 9; // i变量只在 花括号内有效!!! } console.log(i); // Uncaught ReferenceError: i is not defined
let 配合for循环的独特应用
let
非常适合用于 for
循环内部的块级作用域。JS中的for循环体比较特殊,每次执行都是一个全新的独立的块作用域,用let声明的变量传入到 for循环体的作用域后,不会发生改变,不受外界的影响。看一个常见的面试题目:
for (var i = 0; i <10; i++) { setTimeout(function() { // 同步注册回调函数到 异步的 宏任务队列。 console.log(i); // 执行此代码时,同步代码for循环已经执行完成 }, 0); } // 输出结果 10 共10个 // 这里面的知识点: JS的事件循环机制,setTimeout的机制等
如果把 var
改成 let
声明:
// i虽然在全局作用域声明,但是在for循环体局部作用域中使用的时候,变量会被固定,不受外界干扰。 for (let i = 0; i < 10; i++) { setTimeout(function() { console.log(i); // i 是循环体内局部作用域,不受外界影响。 }, 0); } // 输出结果: 0 1 2 3 4 5 6 7 8 9
let没有变量提升与暂时性死区
用let
声明的变量,不存在变量提升。而且要求必须 等let
声明语句执行完之后,变量才能使用,不然会报Uncaught ReferenceError
错误。
例如:
console.log(aicoder); // 错误:Uncaught ReferenceError ... let aicoder = 'aicoder.com'; // 这里就可以安全使用aicoder
ES6 明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。
总之,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。
let变量不能重复声明
let不允许在相同作用域内,重复声明同一个变量。否则报错:Uncaught SyntaxError: Identifier 'XXX' has already been declared
var
: let a = 0; let a = 'sss'; // Uncaught SyntaxError: Identifier 'a' has already been declaredSi vous avez des difficultés à comprendre les questions ci-dessus, veuillez jeter un coup d'œil systématique au didacticiel vidéo avancé JS gratuit de Lao Ma. .
ES6 peut utiliser let pour définir des variables de portée au niveau du bloc
Avant ES6, nous utilisions tous var pour déclarer des variables, et JS n'avait qu'une portée de fonction et une portée globale, pas une portée au niveau du bloc, donc {}
ne peut pas limiter la portée d'accès aux variables déclarées par var. let
de rrreeeES6 peut déclarer des variables au niveau du bloc. rrreeelet application unique avec boucle for
🎜🎜let
est très approprié pour la portée au niveau du bloc à l'intérieur de la boucle for
. Le corps de la boucle for dans JS est spécial. Chaque exécution est une nouvelle portée de bloc indépendante une fois que les variables déclarées avec let sont passées dans la portée du corps de la boucle for, elles ne changeront pas et ne seront pas affectées par le monde extérieur. Regardez une question d'entretien courante : 🎜rrreee🎜Si vous remplacez la déclaration var
par let
: 🎜rrreee🎜🎜🎜let n'a pas de promotion variable ni de zone morte temporaire🎜🎜🎜🎜 Il n'y a pas de promotion de variable pour les variables déclarées avec let
. Et il est nécessaire que la variable ne puisse pas être utilisée jusqu'à ce que l'instruction de déclaration let
soit exécutée, sinon l'erreur Uncaught ReferenceError
sera signalée. 🎜🎜Par exemple : 🎜rrreee🎜🎜ES6 stipule clairement que s'il y a des commandes let et const dans un bloc, les variables déclarées par ces commandes dans ce bloc forment dès le début une portée fermée. Toute utilisation de ces variables avant déclaration entraînera une erreur. Uncaught SyntaxError : Identifier 'XXX' has déjà été déclaré
🎜🎜Par exemple : 🎜rrreee🎜🎜🎜Summary🎜🎜🎜🎜Le let d'ES6 permet à js d'avoir véritablement des blocages. niveau de portée, qui est également une direction pour C'est un chemin plus sûr et plus standardisé. Bien qu'il ajoute de nombreuses contraintes, tout cela vise à nous permettre d'utiliser et d'écrire du code de manière plus sûre. 🎜🎜【Recommandations associées : 🎜tutoriel vidéo javascript🎜, 🎜front-end web🎜】🎜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!