在 Vanilla JavaScript 中声明变量的方法

在 Vanilla JavaScript 中，我们可以使用 var、let 和 const 声明变量。

var

var 可以在全局和函数作用域中声明变量，而且可以多次声明同一个变量。这意味着，当我们在函数内使用 var 声明一个变量时，该变量在函数外也能被访问到。但 var 的作用域是在声明位置之前处理的，这会导致一些问题。

var name = 'Tom';

function sayName() {
  console.log(name); // 输出 'Tom'
  var name = 'John';
}

sayName(); // 输出 undefined

注意，变量 name 在 sayName() 函数内使用 var 声明之后，console.log() 输出了 undefined。这是因为，JavaScript 引擎在编译代码时，会将所有变量声明提升到作用域的顶部，所以 name 变量在 console.log() 之前已经被声明，但还未被赋值，因此它的值是 undefined。

let

为了避免 var 的一些问题，我们可以使用 let 声明变量。let 声明的变量只在块级作用域中有效，也就是说，它在函数内部声明的变量只能在该函数内部使用。该变量只能被声明一次。

let name = 'Tom';

function sayName() {
  console.log(name); // 输出 'Tom'
  let name = 'John';
}

sayName(); // 输出 'Tom'

在上面的代码中，let 声明的 name 变量没有被提升到作用域顶部，因此 console.log() 输出了'Tom'。

const

const 声明的变量也是块级作用域的，但是它的值不能被修改，即使变量是对象或数组类型。

const PI = 3.14;

PI = 3.1415; // 抛出 TypeError

在上面的代码中，我们试图将 PI 变量的值修改为 3.1415，但是因为 PI 是用 const 声明的，这会导致一个 TypeError。

总结

在 Vanilla JavaScript 中，我们可以使用 var、let 和 const 声明变量。var 可以在全局和函数作用域中声明变量，而 let 和 const 只在块级作用域中有效。const 声明的变量的值不能被修改。使用 let 和 const 能够避免使用 var 带来的一些问题。