什么是ES6，为什么使用它？ES6的新增语法—let
Posted 柠夏呀
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了什么是ES6，为什么使用它？ES6的新增语法—let相关的知识，希望对你有一定的参考价值。
什么是ES6？
ECMAScript 6（以下简称ES6）是javascript语言的下一代标准，已经在2015年6月正式发布了。Mozilla公司将在这个标准的基础上，推出JavaScript 2.0。
为什么使用ES6？
每一次标准的诞生都意味着语言的完善，功能的加强。JavaScript语言本身也有一些令人不满意的地方。
- ES6的目标，是使得JavaScript语言可以用来编写大型的复杂的应用程序，成为企业级开发语言。
- 变量提升特性增加了程序运行时的不可预测性
- 语法过于松散，实现相同的功能，不同的人可能会写出不同的代码
ES6的新增语法—let
let的三大特性：
1.用于声明变量的的关键字，必须先声明再使用
2.let声明的变量具有块级作用域
3.暂时性死区特性
下面我通过案例向童靴们解析：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>使用let关键字声明变量</title>
</head>
<body>
<script>
//let关键字用于声明变量的,使用let关键字声明的变量具有块级作用域
let num = 10;
console.log(num);
//错误使用let(let声明变量只在所处于的块级有效)
if (true) {
let nums = 100;
}
console.log(nums); //nums is not defined
</script>
</body>
</html>
浏览器控制器运行如下：
注意：var用于声明全局变量，不具备块级作用域
// 在一个大括号中
// 使用let关键字声明的变量才具有块级作用域，var关键字是不具备这个特点的
if(true) {
let a = 100;var b = 200;
}
console.log(a);
consoLe.log(b);
浏览器控制器运行如下：
// 防止循环变量变成全局变量
for (let i = 0; i < 2; i++) {
}
console.log(i);// 浏览器控制器运行如右：i is not defined
注意：使用let关键字声明的变量具有暂时性死区特性
//使用let关键字声明的变量具有暂时性死区特性;
var num = 10;
if (true) {
consoLe.log(num);
let num = 20;
}
浏览器控制器运行如下：
最后附上所有代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>使用let关键字声明变量</title>
</head>
<body>
<script>
//let关键字用于声明变量的,使用let关键字声明的变量具有块级作用域
let num = 10;
console.log(num);
//错误使用let(let声明变量只在所处于的块级有效)
if (true) {
let nums = 100;
}
console.log(nums); //nums is not defined
// 在一个大括号中
// 使用let关键字声明的变量才具有块级作用域，var关键字是不具备这个特点的
if (true) {
let a = 100;
var b = 200;
}
console.log(b);
consoLe.log(a);
// 防止循环变量变成全局变量
for (let i = 0; i < 2; i++) {
}
console.log(i);//i is not defined
//使用let关键字声明的变量具有暂时性死区特性;
var num = 10;
if (true) {
consoLe.log(num);
let num = 20;
}
</script>
</body>
</html>
以上是关于什么是ES6，为什么使用它？ES6的新增语法—let的主要内容，如果未能解决你的问题，请参考以下文章