浅谈JavaScript之var，let以及const

var

语法及说明

var关键字用于声明一个或多个变量，声明多个变量时使用逗号(,)分隔，声明变量的同时可以对其初始化。

var name1 = value , name2 = value2 , ......

使用var声明变量时，声明的变量作用域是在当前位置的上下文中。
例如：

var a = 1;
function x(){
  a = 2;
  console.log(a);
}
x();

则输出为2，因为全局有效，所以可以修改其值。
但是如果只是将其声明并未赋值，则不会报错，其值为undefined。

var a;
function x(){
  console.log(a);//输出为undefined
}
x();

特点

• 变量声明提升
  无论在代码的任何位置声明变量，执行引擎都会在任何代码执行之前处理。由于这个原因，所以在代码中的任意位置声明变量与在代码开头声明变量是等效的。
  例如：

function x(){
    a = 1;
    var a;
    console.log(a);//输出为1
}
x();

注意：虽然可以先使用再定义变量，但是建议还是先定义再使用，这样可以使变量的作用域更加清晰。

• 声明与未声名变量的区别
  未声明的变量会被添加一个全局作用域，而声明变量作用域是当前上下文:

function x() {
  y = 1;   // 在严格模式下会抛出ReferenceError
  var z = 2;
}
x();
console.log(y); // '1'
console.log(z); // ReferenceError: z is not defined

声明变量在任何代码执行前创建，而未声明的变量只有在执行赋值操作的时候才会被创建：

console.log(a);  // 抛出ReferenceError。
console.log('hello world'); // 不会执行

声明变量是不可配置属性，而未声明变量是可配置的：

var a = 1;
b = 2;
delete this.a; // 在严格模式下抛出TypeError，非严格模式下执行失败且无任何提示
delete this.b;
console.log(a, b); // 抛出ReferenceError，'b'属性已经被删除

在严格模式下，使用未赋值的变量会抛出异常，推荐还是先定义(声明)再使用变量。

let

语法及说明

let用于定义块级变量，其语法结构类似于var：

let name1 = value , name2 = value2 , ......

特点

• var声明的变量是函数级的或者是全局的，而let用于声明块级作用域。

 var a = 1;
  if(a > 0){
     let b = 2;
     console.log(b);//输出2
     a --;
  }
  console.log(a);//输出0
  console.log(b);//“ReferenceError”

所以此时的b的作用域是if语句里面。

• let不允许在相同作用域内，重复声明同一个变量。

function () {
  let a = 1;
  let a = 2;
}//error

• let不存在变量声明提升

a = 1;
let a;
console.log(a);//error

const

语法及说明

const用于声明一个或多个常量，声明时必须进行初始化，且初始化后值不可再修改：

const name1 = value1 , name2 = value2 , ......

特点

• const声明常量，一旦声明，常量的值就不能改变。

const PI = 3.14;
PI = 1;
console.log(PI);//error

• const一旦声明就必须初始化

const a; //error

• const也是块级作用域内有效

 var a = 1;
  if(a > 0){
     const b = 2;
     console.log(b);//输出2
     a --;
  }
  console.log(a);//输出0
  console.log(b);//“ReferenceError”

• const也没有变量声明提升

console.log(a);//error
const a = 1;

何时使用var，let以及const

在ES6中基本已经不建议用var了，因为var定义的变量没有块级作用域，并且它存在变量声明提升，在严格模式下可能会出现意想不到的错误，我们现在推荐使用const，当不能使用const的时候再用let。