在 JavaScript 中，我们通常使用 var、let 或 const 来声明变量。但是，在某些情况下，我们可能会在同一作用域中多次声明一个变量，这就是所谓的“重新声明变量”。
重新声明变量会发生什么？
如果我们尝试在同一作用域内重新声明一个已经存在的变量，JavaScript 引擎将忽略第二个声明，并继续使用第一个声明的值。
例如，考虑以下代码段：
var x = 10; var x = 20; console.log(x); // 输出 20
在上面的代码中，我们先声明了一个变量 x 并赋值为 10。然后，我们重新声明了同样名字的变量 x 并赋值为 20。最后，当我们输出变量 x 的值时，我们得到的结果是 20，而不是 10。这是因为第二次声明被忽略了，JavaScript 引擎继续使用第一个声明的值 10。
需要注意的是，在严格模式 ("use strict";) 下，尝试重新声明一个变量会导致语法错误。
如何避免重新声明变量？
为了避免重新声明变量，我们可以采取以下措施：
1. 使用唯一的变量名
使用唯一的变量名是避免重新声明变量的最简单方法。在编写代码时，我们应该尽可能使用具有描述性的变量名，以确保每个变量都有一个唯一的名称。
var firstName = "John"; var lastName = "Doe"; console.log(firstName + " " + lastName); // 输出 "John Doe"
2. 使用块级作用域
在 ES6 中，我们可以使用 let 或 const 声明变量，并将其限定在一个块级作用域中。这样做可以避免在同一作用域内重新声明变量。
-- -------------------- ---- ------- - --- - - --- --------------- -- -- -- - - --- - - --- --------------- -- -- -- - -- --------- - --- -------------- --
在上面的代码中，我们使用两个块级作用域分别声明了两个不同的变量 x。由于每个块级作用域都是独立的，因此它们之间的变量不会互相干扰。
3. 避免全局变量
全局变量是在全局作用域中声明的变量，可以从任何位置访问。由于全局变量容易被意外修改或覆盖，因此应该尽量避免使用它们。
-- -------------------- ---- ------- --- - - --- -------- ----- - --- - - --- --------------- -- -- -- - ------ --------------- -- -- --
在上面的代码中，我们使用全局变量 x 和局部变量 x。当我们调用函数 foo() 时，它会输出局部变量 x 的值 20。然后，当我们在函数外尝试访问变量 x 时，它会输出全局变量 x 的值 10。
总结
在 JavaScript 中，重新声明变量可能会导致意外行为和错误。为了避免这种情况，我们可以使用唯一的变量名、块级作用域或避免全局变量。当我们编写代码时，应该尽量使用最佳实践，以确保代码的可读性、可维护
Source: FunTeaLearn,Please indicate the source for reprints https://funteas.com/post/27920