变量这东西，JavaScript 里头有点意思
话说回来，写代码这事儿，说白了就是跟电脑“唠嗑”。你得告诉它，你想要干啥，怎么干。而变量，就像是咱们跟电脑聊天时用的“代号”或者“小标签”。比如，你想让电脑记住你的名字，总不能每次都敲一遍“张三李四王二麻子”吧？太累了！这时候，你就可以用个变量，比如 myName = "张三"，以后想用你的名字，直接说 myName 就行了，多方便！
JavaScript 这门语言呢，它也提供了几种声明变量的方式，分别是 var、let 和 const。初学者往往会觉得，哎呀，都是声明变量，有什么区别嘛？随便用一个不就得了？
嘿，还真不能这么随便！这三种声明方式，背后的故事可丰富着呢。用错了，轻则代码看着别扭，重则可能导致程序出现意想不到的 Bug，让你抓耳挠腮，怀疑人生。
所以，今天咱们就来好好聊聊这 var、let 和 const，看看它们各自有什么特点，又该在什么场景下使用，让你的代码更加优雅，更加健壮。
var：老大哥的“甜蜜负担”
var，算是 JavaScript 里的“老大哥”了。在 ES6 (ECMAScript 2015) 之前，它可是声明变量的唯一选择。用 var 声明的变量，有一个很重要的特点，那就是它具有函数作用域。
啥是函数作用域呢？简单来说，就是 var 声明的变量，只能在声明它的函数内部访问。如果在函数外面声明，那它就变成全局变量了，整个脚本都能访问。
举个例子：
function sayHello() {
var message = "你好！";
console.log(message); // 输出：你好！
}
sayHello();
console.log(message); // 报错：message is not defined在这个例子里，message 变量是在 sayHello 函数内部用 var 声明的，所以只能在函数内部访问。如果在函数外面访问，就会报错，说 message 未定义。
听起来好像挺好的，是吧？但 var 也有一些“甜蜜的负担”，也就是它的一些特性，在某些情况下可能会给你带来麻烦。
1. 变量提升 (Hoisting)
var 声明的变量，会发生“变量提升”。也就是说，JavaScript 引擎会在代码执行之前，先把所有用 var 声明的变量“提升”到当前作用域的顶部。但是，提升的只是声明，赋值操作仍然留在原来的位置。
看个例子：
console.log(name); // 输出：undefined
var name = "小明";你可能会觉得奇怪，为什么在声明 name 之前访问它，没有报错，而是输出了 undefined 呢？这就是变量提升在起作用。JavaScript 引擎实际上是这样处理这段代码的：
var name; // 声明提升到顶部
console.log(name); // 输出：undefined (因为此时 name 只是声明了，还没有赋值)
name = "小明"; // 赋值操作仍然留在原来的位置虽然变量提升在某些情况下可以方便你写代码，但有时候也会让你感到困惑，因为你可能会在声明变量之前就访问它，导致出现 undefined 的情况。
2. 可以重复声明
var 允许你重复声明同一个变量，这在某些情况下可能会导致意外的覆盖，让你难以追踪 Bug。
var age = 18;
var age = 20;
console.log(age); // 输出：20在这个例子里，我们用 var 声明了两次 age 变量，后面的声明覆盖了前面的声明，最终 age 的值为 20。
总结：
var 的优点：
- 兼容性好，在老版本的 JavaScript 引擎中也能正常运行。
var 的缺点：
- 函数作用域可能导致变量泄露到全局作用域。
- 变量提升可能导致在声明之前访问变量，出现
undefined的情况。 - 可以重复声明同一个变量，可能导致意外的覆盖。
let：现代 JavaScript 的“得力干将”
let 是 ES6 引入的新的变量声明方式。它解决了 var 的一些问题，让 JavaScript 变得更加现代化。
let 最重要的特点是它具有块级作用域。啥是块级作用域呢？简单来说，就是 let 声明的变量，只能在声明它的代码块内部访问。代码块指的是用花括号 {} 包裹起来的一段代码。
看个例子：
{
let message = "Hello!";
console.log(message); // 输出：Hello!
}
console.log(message); // 报错：message is not defined在这个例子里，message 变量是在一个代码块内部用 let 声明的，所以只能在这个代码块内部访问。如果在代码块外面访问，就会报错，说 message 未定义。
与 var 相比，let 的块级作用域可以有效地防止变量泄露到全局作用域，让你的代码更加安全。
let 的其他特点：
- 不存在变量提升：
let声明的变量，不存在变量提升。也就是说，你必须在声明变量之后才能访问它，否则会报错。
console.log(name); // 报错：Cannot access 'name' before initialization
let name = "小明";- 不允许重复声明： 在同一个作用域内，
let不允许你重复声明同一个变量，否则会报错。
let age = 18;
let age = 20; // 报错：Identifier 'age' has already been declared总结：
let 的优点：
- 块级作用域可以有效地防止变量泄露到全局作用域。
- 不存在变量提升，可以避免在声明之前访问变量。
- 不允许重复声明，可以避免意外的覆盖。
let 的缺点：
- 兼容性不如
var，在老版本的 JavaScript 引擎中可能无法正常运行。
const：不变的承诺
const 也是 ES6 引入的新的变量声明方式。它用于声明常量，也就是说，一旦声明，就不能再修改它的值。
const 也具有块级作用域，并且不存在变量提升，也不允许重复声明，这些特性都和 let 类似。
const PI = 3.14159;
console.log(PI); // 输出：3.14159
PI = 3.14; // 报错：Assignment to constant variable.在这个例子里，我们用 const 声明了 PI 常量，并赋值为 3.14159。如果我们试图修改 PI 的值，就会报错。
注意：
const声明的常量，必须在声明的时候就进行赋值，否则会报错。
const MESSAGE; // 报错：Missing initializer in const declaration
MESSAGE = "Hello!";- 如果
const声明的是一个对象，那么虽然不能修改这个对象的引用，但是可以修改对象内部的属性。
const person = {
name: "小明",
age: 18
};
person.age = 20; // 可以修改对象内部的属性
console.log(person.age); // 输出：20
person = { // 报错：Assignment to constant variable.
name: "小红",
age: 22
};总结：
const 的优点：
- 可以确保变量的值不会被意外修改，提高代码的健壮性。
- 具有块级作用域，不存在变量提升，不允许重复声明。
const 的缺点：
- 必须在声明的时候就进行赋值。
- 如果声明的是对象，只能保证引用不变，不能保证对象内部的属性不变。
- 兼容性不如
var，在老版本的 JavaScript 引擎中可能无法正常运行。
最佳实践：告别混乱，拥抱优雅
现在，我们已经了解了 var、let 和 const 的异同。那么，在实际开发中，我们应该如何选择呢？
我的建议是：
-
尽量避免使用
var： 除非你需要兼容老版本的 JavaScript 引擎，否则尽量避免使用var。let和const提供了更好的作用域控制和更强的约束，可以帮助你编写更安全、更易于维护的代码。 -
优先使用
const： 如果变量的值在初始化之后不会再改变，那么就使用const来声明。这可以明确地告诉其他人，这个变量是一个常量，避免被意外修改。 -
只有在需要修改变量的值时才使用
let： 如果变量的值需要在程序运行过程中发生改变，那么就使用let来声明。
举个例子：
假设我们要计算一个圆的面积。我们可以这样写：
const PI = 3.14159;
let radius = 5;
let area = PI * radius * radius;
console.log("圆的面积是：" + area);
radius = 10;
area = PI * radius * radius;
console.log("圆的面积是：" + area);在这个例子里，PI 的值是不会改变的，所以我们用 const 来声明。radius 和 area 的值会随着程序的运行而发生改变，所以我们用 let 来声明。
总结：
选择合适的变量声明方式，可以让你的代码更加清晰、易懂、健壮。记住，var 是过去，let 和 const 才是未来！
希望这篇文章能够帮助你更好地理解 JavaScript 变量声明，让你在编程的道路上更加自信、更加从容。祝你编程愉快！