ES6新属性-let和const

JavaScript Let

在 ES2015 之前，JavaScript 只有两种类型的作用域：全局作用域和函数作用域。

ES2015 引入了两个重要的 JavaScript 新关键词：let 和 const。

这两个关键字在 JavaScript 中提供了块作用域（Block Scope）变量（和常量）。

全局作用域

全局（在函数之外）声明的变量拥有全局作用域。

全局变量可以在 JavaScript 程序中的任何位置访问。

var carName = "car";
console.log(carName);//car

function myFunction() {
  console.log(carName);
}
myFunction();//car

函数作用域

局部（函数内）声明的变量拥有函数作用域。

局部变量只能在它们被声明的函数内访问。

//console.log(carName);//报错 此处的代码不可以使用 carName

function myFunction() {
  var carName = "car";
  console.log(carName)// code here CAN use carName
}
myFunction();
//console.log(carName);// 报错 此处的代码不可以使用 carName

JavaScript 块作用域

通过 var 关键词声明的变量没有块作用域。

在块 {  } 内声明的变量可以从块之外进行访问。

{ 
  var x = 10; 
}
console.log(x);// 10 此处可以使用 x

在 ES2015 之前，JavaScript 是没有块作用域的。

可以使用 let 关键词声明拥有块作用域的变量。

在块 {   } 内声明的变量无法从块外访问：

{ 
  let x = 10; 
}
console.log(x);//报错  此处不可以使用 x

重新声明变量

使用 var 关键字重新声明变量会带来问题。

在块中重新声明变量也将重新声明块外的变量：

var x = 10;
console.log(x);// 此处 x 为 10
{ 
  var x = 6;
  console.log(x);// 此处 x 为 6
}
console.log(x);// 此处 x 为 6

使用 let 关键字重新声明变量可以解决这个问题。

在块中重新声明变量不会重新声明块外的变量：

var x = 10;
console.log(x);// 此处 x 为 10
{ 
  let x = 6;
  console.log(x);// 此处 x 为 6
}
console.log(x);// 此处 x 为 10

JavaScript Const

通过 const 定义的变量与 let 变量类似，但不能重新赋值：

const PI =5;
PI = 6;      // 会出错
PI = PI + 10;   // 也会出错

块作用域

在块作用域内使用 const 声明的变量与 let 变量相似。

在本例中，x 在块中声明，不同于在块之外声明的 x：

var x = 10;
console.log(x);// 此处，x 为 10
{ 
  const x = 6;
  console.log(x);// 此处，x 为 6
}
console.log(x);// 此处，x 为 10
// const x=9;//语法错误，x已经被定义，不能重复
// console.log(x);
var x=9;
console.log(x);//此处x为9

JavaScript const 变量必须在声明时赋值：

//const PI;//语法错误：“常量声明”需要初始化值。
const PI=3.14

不是真正的常数

关键字 const 有一定的误导性。

它没有定义常量值。它定义了对值的常量引用。

因此，我们不能更改常量原始值，但我们可以更改常量对象的属性。

const PI =5;
PI = 6;      // 会出错
PI = PI + 10;   // 也会出错


//可以更改常量对象的属性：
// 可以创建 const 对象：
const car = {type:"porsche", model:"911", color:"Black"};
console.log(car);    // {type:"porsche", model:"911", color:"Black"}
// 可以更改属性：
car.color = "White";
console.log(car);    // {type:"porsche", model:"911", color:"White"}
// 可以添加属性：
car.owner = "Bill";
console.log(car);    // {type:"porsche", model:"911", color:"White",owner:"Bill"}


//无法重新为常量对象赋值：
const car = {type:"porsche", model:"911", color:"Black"};
car = {type:"Volvo", model:"XC60", color:"White"};    // ERROR


//可以更改常量数组的元素：
// 可以创建常量数组：
const cars = ["Audi", "BMW", "porsche"];
console.log(cars);      //["Audi", "BMW", "porsche"]
// 可以更改元素：
cars[0] = "Honda";
console.log(cars);      //["Honda", "BMW", "porsche"]
// 可以添加元素：
cars.push("Volvo");      //["Honda", "BMW", "porsche","Volvo"]
console.log(cars);


//无法重新为常量数组赋值：
const cars = ["Audi", "BMW", "porsche"];
cars = ["Honda", "Toyota", "Volvo"];    // ERROR