const-var-let

發表於 | 分類於 ， ，
let和const都是es5，es6新版本的js语言规范出来的定义，在这以前定义一个变量只能用var。let和const都是为了弥补var的一些缺陷而新设计出来的。

let语法

let 语句声明一个块级作用域的本地变量，并且可选的将其初始化为一个值。

1
let var1 [= value1] [, var2 [= value2]] [, ..., varN [= valueN]];

##作用域规则

let声明的变量只在其声明的块或子块中可用，这一点，与var相似。二者之间最主要的区别在于var声明的变量的作用域是整个封闭函数。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function varTest() {
  var x = 1;
  if (true) {
    var x = 2;  // 同样的变量!
    console.log(x);  // 2
  }
  console.log(x);  // 2
}
function letTest() {
  let x = 1;
  if (true) {
    let x = 2;  // 不同的变量
    console.log(x);  // 2
  }
  console.log(x);  // 1
}

##简化内部函数代码

当用到内部函数的时候，let会让你的代码更加简单。

1
2
3
4
5
6
7
8
9
10
11
12
var list = document.getElementById("list");
for (let i = 1; i <= 5; i++) {
  var item = document.createElement("LI");
  item.appendChild(document.createTextNode("Item " + i));
  let j = i;
  item.onclick = function (ev) {
    console.log("Item " + j + " is clicked.");
  };
  list.appendChild(item);
}

const语法

常量是块级作用域， 很像使用 let 语句定义的变量。常量的值不能通过重新赋值来改变，并且不能重新声明。

1
const name1 = value1 [, name2 = value2 [, ... [, nameN = valueN]]];

##example

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
// 注意: 常量在声明的时候可以使用大小写，但通常情况下会使用全部大写英文。 
// 定义常量MY_FAV并赋值7
const MY_FAV = 7;
// 报错
MY_FAV = 20;
// 输出 7
console.log("my favorite number is: " + MY_FAV);
// 尝试重新声明会报错 
const MY_FAV = 20;
//  MY_FAV 保留给上面的常量，这个操作会失败
var MY_FAV = 20; 
// 也会报错
let MY_FAV = 20;
// 注意块范围的性质很重要
if (MY_FAV === 7) { 
    // 没问题，并且创建了一个块作用域变量 MY_FAV
    // (works equally well with let to declare a block scoped non const variable)
    let MY_FAV = 20;
    // MY_FAV 现在为 20
    console.log('my favorite number is ' + MY_FAV);
    // 这被提升到全局上下文并引发错误
    var MY_FAV = 20;
}
// MY_FAV 依旧为7
console.log("my favorite number is " + MY_FAV);
// 常量要求一个初始值
const FOO; // SyntaxError: missing = in const declaration
// 常量可以定义成对象
const MY_OBJECT = {"key": "value"};
// 重写对象和上面一样会失败
MY_OBJECT = {"OTHER_KEY": "value"};
// 对象属性并不在保护的范围内，下面这个声明会成功执行
MY_OBJECT.key = "otherValue";
// 也可以用来定义数组
const MY_ARRAY = [];
// It's possible to push items into the array
// 可以向数组填充数据
MY_ARRAY.push('A'); // ["A"]
// 但是，将一个新数组赋给变量会引发错误
MY_ARRAY = ['B']

var语法

变量语句声明了一个变量，可选地将其初始化为一个值。

1
var varname1 [= value1 [, varname2 [, varname3 ... [, varnameN]]]];

##example

1
2
3
4
5
for(var i=0;i<=1000;i++){ 
var sum=0; 
sum+=i; 
} 
alert(sum);

简单总结

  • 使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象；
  • 使用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升；
  • 使用const声明的是常量，在后面出现的代码中不能再修改该常量的值。

详细说明可以参考 深入浅出ES6(十四)let和const