是否使用 let 或 const 提升了声明的变量?

2024-04-19前端开发问题
5

本文介绍了是否使用 let 或 const 提升了声明的变量?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

我玩 ES6 已经有一段时间了,我注意到虽然用 var 声明的变量按预期提升...

I have been playing with ES6 for a while and I noticed that while variables declared with var are hoisted as expected...

console.log(typeof name); // undefined
var name = "John";

...用 letconst 声明的变量似乎有一些提升问题:

...variables declared with let or const seem to have some problems with hoisting:

console.log(typeof name); // ReferenceError
let name = "John";

console.log(typeof name); // ReferenceError
const name = "John";

这是否意味着用 letconst 声明的变量不会被提升?这里到底发生了什么?letconst 在这件事上有什么区别吗?

Does this mean that variables declared with let or const are not hoisted? What is really going on here? Is there any difference between let and const in this matter?

推荐答案

@thefourtheye 说这些变量在声明之前无法访问是正确的.但是,它比这要复杂一些.

@thefourtheye is correct in saying that these variables cannot be accessed before they are declared. However, it's a bit more complicated than that.

letconst 声明的变量是否没有提升?这里到底发生了什么?

Are variables declared with let or const not hoisted? What is really going on here?

所有声明(varletconstfunctionfunction*, class) 在 JavaScript 中被提升".这意味着如果在一个范围内声明了一个名称,那么在该范围内,标识符将始终引用该特定变量:

All declarations (var, let, const, function, function*, class) are "hoisted" in JavaScript. This means that if a name is declared in a scope, in that scope the identifier will always reference that particular variable:

x = "global";
// function scope:
(function() {
    x; // not "global"

    var/let/… x;
}());
// block scope (not for `var`s):
{
    x; // not "global"

    let/const/… x;
}

对于函数和块范围都是如此1.

This is true both for function and block scopes1.

var/function/function*声明和let/const/class 声明是初始化.
当绑定在作用域的顶部创建时,前者使用 undefined 或 (generator) 函数进行初始化.然而,词法声明的变量保持未初始化.这意味着当您尝试访问它时会引发 ReferenceError 异常.它只会在 let/const/class 语句被评估时被初始化,之前(上面)的所有内容都称为 temporal死区.

The difference between var/function/function* declarations and let/const/class declara­tions is the initialisation.
The former are initialised with undefined or the (generator) function right when the binding is created at the top of the scope. The lexically declared variables however stay uninitialised. This means that a ReferenceError exception is thrown when you try to access it. It will only get initialised when the let/const/class statement is evaluated, everything before (above) that is called the temporal dead zone.

x = y = "global";
(function() {
    x; // undefined
    y; // Reference error: y is not defined

    var x = "local";
    let y = "local";
}());

请注意,let y; 语句使用 undefined 初始化变量,就像 let y = undefined; 一样.

Notice that a let y; statement initialises the variable with undefined like let y = undefined; would have.

时间死区不是句法位置,而是变量(范围)创建和初始化之间的时间.只要不执行该代码(例如函数体或简单的死代码),在声明上方的代码中引用变量就不是错误,并且如果您在初始化之前访问该变量,即使访问该变量也会引发异常代码位于声明下方(例如,在过早调用的提升函数声明中).

The temporal dead zone is not a syntactic location, but rather the time between the variable (scope) creation and the initialisation. It's not an error to reference the variable in code above the declaration as long as that code is not executed (e.g. a function body or simply dead code), and it will throw an exception if you access the variable before the initialisation even if the accessing code is below the declaration (e.g. in a hoisted function declaration that is called too early).

letconst在这件事上有什么区别吗?

Is there any difference between let and const in this matter?

不,就提升而言,它们的工作方式相同.它们之间的唯一区别是 constant 必须并且只能在声明的初始化部分中赋值(const one = 1;,两者都是 constone; 和以后的重新分配,如 one = 2 无效).

No, they work the same as far as hoisting is regarded. The only difference between them is that a constant must be and can only be assigned in the initialiser part of the declaration (const one = 1;, both const one; and later reassignments like one = 2 are invalid).

1:当然,var 声明仍然只在函数级别起作用

1: var declarations are still working only on the function level, of course

这篇关于是否使用 let 或 const 提升了声明的变量?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

The End

相关推荐

js删除数组中指定元素的5种方法
在JavaScript中,我们有多种方法可以删除数组中的指定元素。以下给出了5种常见的方法并提供了相应的代码示例: 1.使用splice()方法: let array = [0, 1, 2, 3, 4, 5];let index = array.indexOf(2);if (index -1) { array.splice(index, 1);}// array = [0,...
2024-11-22 前端开发问题
182

JavaScript小数运算出现多位的解决办法
在开发JS过程中,会经常遇到两个小数相运算的情况,但是运算结果却与预期不同,调试一下发现计算结果竟然有那么长一串尾巴。如下图所示: 产生原因: JavaScript对小数运算会先转成二进制,运算完毕再转回十进制,过程中会有丢失,不过不是所有的小数间运算会...
2024-10-18 前端开发问题
301

JavaScript(js)文件字符串中丢失"\"斜线的解决方法
问题描述: 在javascript中引用js代码,然后导致反斜杠丢失,发现字符串中的所有\信息丢失。比如在js中引用input type=text onkeyup=value=value.replace(/[^\d]/g,) ,结果导致正则表达式中的\丢失。 问题原因: 该字符串含有\,javascript对字符串进行了转...
2024-10-17 前端开发问题
437

layui中table列表 增加属性 edit="date",不生效怎么办?
如果你想在 layui 的 table 列表中增加 edit=date 属性但不生效,可能是以下问题导致的: 1. 缺少日期组件的初始化 如果想在表格中使用日期组件,需要在页面中引入 layui 的日期组件,并初始化: script type="text/javascript" src="/layui/layui.js"/scrip...
2024-06-11 前端开发问题
455

Rails/Javascript:如何将 rails 变量注入(非常)简单的 javascript
Rails/Javascript: How to inject rails variables into (very) simple javascript(Rails/Javascript:如何将 rails 变量注入(非常)简单的 javascript)...
2024-04-20 前端开发问题
5

CoffeeScript 总是以匿名函数返回
CoffeeScript always returns in anonymous function(CoffeeScript 总是以匿名函数返回)...
2024-04-20 前端开发问题
13