JavaScript------ let 和 const

ECMAScript 2015(ECMAScript 6)

ES2015(ES6) 新增加了两个重要的 JavaScript 关键字: let 和 const。

let 声明的变量只在 let 命令所在的代码块内有效。

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

在 ES6 之前，JavaScript 只有两种作用域： 全局变量 与 函数内的局部变量。

let

全局变量

全局变量在Javascript的任何地方都可以使用。

局部变量

在函数内声明的变量作用域是局部的。

JavaScript块级作用域（Block Scope）

let 声明的变量只在let 命令所在的代码块{}内有效，在{}之外不能访问。

重新定义变量

使用var关键字重新声明变量可能会带来问题。比如：

var x = 1

//这里输出1

{

var x = 2;
//这里输出2
}

//这里输出2	

在块中重新声明变量也会重新声明块外的变量。
let关键字可以解决这个问题。

var x = 1

//这里输出1

{

var x = 2;
//这里输出2
}

//这里输出1

循环作用域

var i = 5;
for(var i = 0;i<10;i++;){
	//一些代码
}
//这里输出i为10

let i = 5;
for(let i = 0;i<10;i++){
	//一些代码
}
//这里输出i为5

第一个实例中使用了关键字var，声明的i是全局的，包括循环体内和循环体外。
第二个实例中使用了关键字let，声明的i只作用于循环体内，循环体外的同名变量不受影响。

HTML代码中使用全局变量

在 JavaScript 中, 全局作用域是针对 JavaScript 环境。

在 HTML 中, 全局作用域是针对 window 对象。

使用 var 关键字声明的全局作用域变量属于 window 对象:

var carName = "Volvo";
// 可以使用 window.carName 访问变量

使用 let 关键字声明的全局作用域变量不属于 window 对象:

let carName = "Volvo";
// 不能使用 window.carName 访问变量

重置变量

使用 var 关键字声明的变量在任何地方都可以修改：

var x = 2;
 
// x 为 2
 
var x = 3;
 
// 现在 x 为 3

Javascript 教程
JavaScript 教程
JavaScript 简介
JavaScript 用法
JavaScript 输出
JavaScript 语法
JavaScript 语句
JavaScript 注释
JavaScript 变量
JavaScript 数据类型
JavaScript 对象
JavaScript 函数
JavaScript 作用域
JavaScript 事件
JavaScript 字符串
JavaScript 运算符
JavaScript 比较
JavaScript 条件语句
JavaScript switch 语句
JavaScript for 循环
JavaScript while 循环
JavaScript break 和 continue 语句
JavaScript typeof
JavaScript 类型转换
JavaScript 正则表达式
JavaScript 错误
JavaScript 调试
JavaScript 变量提升
JavaScript 严格模式
JavaScript 使用误区
JavaScript 表单
JavaScript 表单验证
JavaScript 验证 API
JavaScript 保留关键字
JavaScript this
JavaScript let 和 const
JavaScript JSON
JavaScript void
JavaScript 异步编程
JavaScript Promise
JavaScript 代码规范

JS 函数
JavaScript 函数定义
JavaScript 函数参数
JavaScript 函数调用
JavaScript 闭包

JS HTML DOM
DOM 简介
DOM HTML
DOM CSS
DOM 事件
DOM EventListener
DOM 元素
HTMLCollection 对象
NodeList 对象

JS 高级教程
JavaScript 对象
JavaScript prototype
JavaScript Number 对象
JavaScript String
JavaScript Date（日期）
JavaScript Array（数组）
JavaScript Boolean（布尔）
JavaScript Math（算数）
JavaScript RegExp 对象

JS 浏览器BOM
JavaScript Window
JavaScript Window Screen
JavaScript Window Location
JavaScript Window History
JavaScript Navigator
JavaScript 弹窗
JavaScript 计时事件
JavaScript Cookie

JS 库
JavaScript 库
JavaScript 测试 jQuery
JavaScript 测试 Prototype

JS 实例
JavaScript 实例
JavaScript 对象实例
JavaScript 浏览器对象实例
JavaScript HTML DOM 实例
JavaScript 总结

JS 参考手册
JavaScript 对象
HTML DOM 对象
JavaScript 异步编程
JavaScript this
JavaScript JSON
JavaScript let 和 const
ECMAScript 2015(ECMAScript 6)

ES2015(ES6) 新增加了两个重要的 JavaScript 关键字: let 和 const。

let 声明的变量只在 let 命令所在的代码块内有效。

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

在 ES6 之前，JavaScript 只有两种作用域： 全局变量 与 函数内的局部变量。
全局变量

在函数外声明的变量作用域是全局的：
实例
var carName = “Volvo”;

// 这里可以使用 carName 变量

function myFunction() {
// 这里也可以使用 carName 变量
}

尝试一下 »

全局变量在 JavaScript 程序的任何地方都可以访问。
局部变量

在函数内声明的变量作用域是局部的（函数内）：
实例
// 这里不能使用 carName 变量

function myFunction() {
var carName = “Volvo”;
// 这里可以使用 carName 变量
}

// 这里不能使用 carName 变量

尝试一下 »

函数内使用 var 声明的变量只能在函数内容访问，如果不使用 var 则是全局变量。
JavaScript 块级作用域(Block Scope)

使用 var 关键字声明的变量不具备块级作用域的特性，它在 {} 外依然能被访问到。

{
var x = 2;
}
// 这里可以使用 x 变量

在 ES6 之前，是没有块级作用域的概念的。

ES6 可以使用 let 关键字来实现块级作用域。

let 声明的变量只在 let 命令所在的代码块 {} 内有效，在 {} 之外不能访问。

{
let x = 2;
}
// 这里不能使用 x 变量

重新定义变量

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

在块中重新声明变量也会重新声明块外的变量：
实例
var x = 10;
// 这里输出 x 为 10
{
var x = 2;
// 这里输出 x 为 2
}
// 这里输出 x 为 2

尝试一下 »

let 关键字就可以解决这个问题，因为它只在 let 命令所在的代码块 {} 内有效。
实例
var x = 10;
// 这里输出 x 为 10
{
let x = 2;
// 这里输出 x 为 2
}
// 这里输出 x 为 10

尝试一下 »
浏览器支持

Internet Explorer 11 及更早版本的浏览器不支持 let 关键字。

下表列出了各个浏览器支持 let 关键字的最低版本号。

Chrome 49 IE / Edge 12 Firefox 44 Safari 11 Opera 36
Mar, 2016 Jul, 2015 Jan, 2015 Sep, 2017 Mar, 2016
循环作用域

使用 var 关键字：
实例
var i = 5;
for (var i = 0; i < 10; i++) {
// 一些代码…
}
// 这里输出 i 为 10

尝试一下 »

使用 let 关键字：
实例
let i = 5;
for (let i = 0; i < 10; i++) {
// 一些代码…
}
// 这里输出 i 为 5

尝试一下 »

在第一个实例中，使用了 var 关键字，它声明的变量是全局的，包括循环体内与循环体外。

在第二个实例中，使用 let 关键字， 它声明的变量作用域只在循环体内，循环体外的变量不受影响。
局部变量

在函数体内使用 var 和 let 关键字声明的变量有点类似。

它们的作用域都是 局部的:

// 使用 var
function myFunction() {
var carName = “Volvo”; // 局部作用域
}

// 使用 let
function myFunction() {
let carName = “Volvo”; // 局部作用域
}

全局变量

在函数体外或代码块外使用 var 和 let 关键字声明的变量也有点类似。

它们的作用域都是 全局的:

// 使用 var
var x = 2; // 全局作用域

// 使用 let
let x = 2; // 全局作用域

HTML 代码中使用全局变量

在 JavaScript 中, 全局作用域是针对 JavaScript 环境。

在 HTML 中, 全局作用域是针对 window 对象。

使用 var 关键字声明的全局作用域变量属于 window 对象:
实例
var carName = “Volvo”;
// 可以使用 window.carName 访问变量

尝试一下 »

使用 let 关键字声明的全局作用域变量不属于 window 对象:
实例
let carName = “Volvo”;
// 不能使用 window.carName 访问变量

尝试一下 »
重置变量

使用 var 关键字声明的变量在任何地方都可以修改：
实例
var x = 2;

// x 为 2

var x = 3;

// 现在 x 为 3

尝试一下 »

在相同的作用域或块级作用域中，不能使用 let 关键字来重置 var 关键字声明的变量:

var x = 2;       // 合法
let x = 3;       // 不合法

{
    var x = 4;   // 合法
    let x = 5   // 不合法
}

在相同的作用域或块级作用域中，不能使用 let 关键字来重置 let 关键字声明的变量:

let x = 2;       // 合法
let x = 3;       // 不合法

{
    let x = 4;   // 合法
    let x = 5;   // 不合法
}

在相同的作用域或块级作用域中，不能使用 var 关键字来重置 let 关键字声明的变量:

let x = 2;       // 合法
var x = 3;       // 不合法

{
    let x = 4;   // 合法
    var x = 5;   // 不合法
}

let 关键字在不同作用域，或不同块级作用域中是可以重新声明赋值的:

let x = 2;       // 合法

{
    let x = 3;   // 合法
}

{
    let x = 4;   // 合法
}

变量提升

JavaScript 中，var 关键字定义的变量可以在使用后声明，也就是变量可以先使用再声明（JavaScript 变量提升）

// 在这里可以使用 carName 变量
 
var carName;

let 关键字定义的变量则不可以在使用后声明，也就是变量需要先声明再使用。

// 在这里不可以使用 carName 变量

let carName;

const