var、let 和 const 之间有什么关系？

由 Mux 赞助的 DEV 全球展示挑战赛：展示你的项目！

假设您了解一些JS基础知识

我们先从var声明变量的“old”关键字开始。var它是顶级变量（也称为全局变量）。让我用一个例子来说明它的含义。

function logName(setName){
  if(setName){
    var name = 'Dennis';
    console.log(name);
  } else {
    console.log(name);
  }
}

logName(true); // 'Dennis'

返回结果Dennis符合预期。

logName(false); // Undefined (?)

为什么这个值是 undefined？它不应该返回一个值吗ReferenceError？这叫做变量提升。JavaScript 的工作原理是将变量提升到代码的最顶层，也就是代码的顶部。你可以这样理解：

function logName(setName){
  var name;
  if(setName){
    name = 'Dennis';
    console.log(name);
  } else {
    console.log(name);
  }
}

现在明白了吧？如果这样理解，我们预期它的值为未定义。

在 JavaScript 中，变量可以在使用之前声明。
换句话说，变量可以在声明之前使用。

~ w3schools

所以这就是let和const发挥作用的地方了。

let和const是代码块级别的。代码块是指开头{和结尾之间的任何内容。}

function logName(setName){
  if(setName){
    let name = 'Dennis';
    console.log(name);
  } else {
    console.log(name);
  }
}

logName(true); // 'Dennis'

返回结果Dennis符合预期。

logName(false); // Uncaught ReferenceError: name is not defined

引用错误！这正是我们想要的 :) 因为我们根本不希望变量名存在。

const.. vs ..let

数组 Aconst不能被重新赋值，但它并非不可变。你仍然可以修改它，例如：对于一个数组，你仍然可以进行压入和弹出操作，但不能将其重新赋值给一个新的数组。让我们来看看具体会发生什么。

重新赋值常量：

const names = ['Dennis', 'Daan'];

names = ['Harry', 'Faye'];

console.log(names);

Uncaught TypeError: Assignment to constant variable

这样做行不通。我们会收到类型错误。我们不能重新赋值常量。

但是，只有初始赋值是不可变的。我们仍然可以更改数组中的其他值。

更新常量的值：

const names = ['Dennis', 'Daan'];

names.push('Harry');
names.push('Faye');

console.log(names);

(4) ["Dennis", "Daan", "Harry", "Faye"]

不再需要使用 var 变量了吗？

如果你一直编写正确的代码，你很可能可以将所有 `var` 语句转换为 `let` 语句而无需任何语义更改。`let`

更可取，因为它缩小了标识符的可见范围。它允许我们在首次使用变量时安全地声明变量。`const`

比 `let` 更可取。除非你需要修改引用，否则请使用 `const` 声明。这不仅具备 `let` 的所有优点，还能减少未初始化变量的出现，并使代码更易于理解。如果你不确定是否需要修改引用，请将其声明为 `const`，直到你明确需要这样做为止。

~阿卢安·哈达德

何时使用什么？

我并不是说每个人都应该坚持以下策略，但这对我来说似乎很有效：

• 默认值为常量
• 如果需要更改值，请切换到let 语句。
• var可以放在顶层。但用处不大，如果你想要这种行为，也可以在顶层放一个 let。

Object.freeze()哦，如果你想让它不可变，可以使用： →。

这是我的第一篇博客！如果您有任何反馈意见，请告诉我 :)