理解JavaScript的var, let和const使用与作用域

在JavaScript里，var，let和const都可以用来声明变量的。

var username= '张三';
let gender = 'Male';
const age = 20;

let，var和const的使用

let和var可以在声明后更改它们的值，并且在声明时不赋值，JavaScript会自动以默认值对它们做初始化。const声明的变量不能改变，也即是常量，声明变量时必须赋值。

var username= '张三';
let gender = 'Male';
const age = 20;

username= '翠花'; // 运行正常 
gender = 'Female'; // 运行正常
age = 18; // 报错TypeError: Assignment to constant variable.

let，var和const的声明不赋值示例

var username; // 运行正常，默认值为undefined
let gender ; //运行正常，默认值为undefined
const age; // 报错SyntaxError: Missing initializer in const declaration

const实际是声明了一个常量，有以下特点：

如果值是对象，可以更改对象属性值，也可以添加其他属性。但不能重新赋值。
如果值是数组，则数组中的值可以更改，但不能重新赋值。
风格选择：为了和变量区分开，可以把const声明的常量用大写标识，如const PAHT = “/path”

// 对象常量
const user = {
  username: '张三',
};

user.username= '李四'; //修改常量user里的属性值
user.gender= 'Male'; // 给常量user添加gender属性
delete user.username; // 删除常量user的属性
user = {}; // 重新赋值，报错TypeError: Assignment to constant variable.

// 数组常量
const arr = [1, 2, 3];
arr.push(4); // 添加值
arr = []; // 重新赋值，报错TypeError: Assignment to constant variable.

声明变量或常量的作用域

变量的作用域决定了程序的哪些其他部分可以访问它。JavaScript 中的作用域分为三种类型：

函数作用域
块作用域
全局作用域

函数作用域

在函数中声明的变量将具有函数作用域。无论是声明为 var、let 还是 const，它都只能在声明它的函数中访问。

// 函数作用域
function doSomething() {
  var username= '张三';
  let gender= 'Male';
  const age = 20;
}
doSomething();

console.log(username);
console.log(gender);
console.log(age );

因为这三个变量/常量是在函数doSomething中声明的，为函数作用域，所以在函数外调用报错：

Uncaught ReferenceError: username is not defined
   at <anonymous>:8:13

块作用域

使用大括号{}将代码包起来就创建了块作用域。块作用域对let，var，const影响是有区别的：

let 和 const 都不能在定义它们的块之外访问。
var可以在定义它的块之外访问。

// 块作用域
{
  var username= '张三';
  let gender= 'Male';
  const age = 20;
}

console.log(username); // 输出张三
console.log(gender); // 报错Uncauses ReferenceError: gender is not defined
console.log(age); // 报错Uncauses ReferenceError: age is not defined

for循环也构成了一个块作用域：

//var定义变量
for (var x = 0; x < 10; x++) {
  console.log(x); //输出0到9
}
console.log(x);// 输出10

//let定义变量
for (let y = 0; y < 10; y++) {
  console.log(y);  //输出0到9
}
console.log(y);
// 报错UnCauses ReferenceError: y is not defined

全局作用域

全局作用域是在函数作用域和块作用域之外声明的变量。这些变量可以在 JavaScript 程序中全局访问。尽量不要使用全局变量。在 JavaScript 程序中拥有许多全局变量通常会导致无法预料的错误。

var username= '张三';
  let gender= 'Male';
  const age = 20;

// 函数作用域内变量可以使用
function doSomething() {
  console.log(username);    //输出张三
  console.log(gender);      //输出Male
  console.log(age );        //输出20
}
doSomething();

// 块作用域内变量可以使用
{
  console.log(username);    //输出张三
  console.log(gender);      //输出Male
  console.log(age );        //输出20
}

总结

声明变量使用let，尽量不要使用var，由于var可以超出块作用域，这样可能会导致程序中出现无法预料的错误
当确定值不会更改时，使用const，把它声明为常量。