es是js的规范,而js是具体实现
将es6转化为es5代码工具:运用的多的是babel
1.let申明变量:let其实可以完全取代var,并且没有var这么多副作用
{
var a = 10;
let b = 10;//let申明的变量是块级作用域
}
console.log(a)//
// console.log(b)//b is not defined
let很适合的一种场景是:for
for (let i = 0; i < 3; i++) {
console.log(i)
}
for (var j = 0; j < 3; j++) {
console.log(j)
}
// console.log(i)//i is not defined
console.log(j)//
看下面这种情况:
var k = []
for (var i1 = 0; i1 < 5; i1++) {//var i1,申明了全局变量i1,只存在一个i1;即每次循环的i1指向的都是同一个i1
k[i1] = function () {
console.log(i1);
}
}
k[3]();// var p = []
for (let i2 = 0; i2 < 5; i2++) {//let i2,申明变量i2,只在块级作用域有效;即每次循环的i2都是新的、重新申明的变量(同时js引擎内部可以记住上一次循环的值)
p[i2] = function () {
console.log(i2)
}
}
p[3]()//
注意下面这种情况:
for(let i3=0;i3<3;i3++){//圆括号里面是一个作用域
let i3=10//花括号里面又是一个作用域
console.log(i3)
}
//输出:10 10 10
let不存在变量提升(对比var变量提升)
console.log(i4)//i4 is not defined
let i4=10
console.log(i5) //undefined 未赋值
var i5=100
暂时性死区:在es6中,如果区块中存在let和const命令申明的变量,这个区块就对变量形成封闭作用域。即暂时性死区(temporal dead zone,简称TDZ)
var people=100
if(true){
//TDZ开始
// console.log(people)//people is not defined
let people=1000//TDZ结束
console.log(people)
}
暂时性死区本质:进入区块,只有let申明变量后,才能进行访问
let不允许在相同作用域下重复申明变量
function test(){
let a=10;
// var a=100
let a=1000
}
test()//报错,a已被申明
块级作用域的出现使得IIFE不再必要了;块级作用域外部不能访问块级作用域中的let申明的变量;借助花括号(可以嵌套多个),块级作用域的写法:
{
let a100=100
}
console.log(a100)//报错
const:const申明只读的常量;申明时必须同时赋值,否则报错;同理,const与let一样都是块级作用域范围
实质上:const是保证变量指向的内存地址不得改动。对于简单类型(数值,字符串,布尔值),表现为值不能改变;而对于复合类型(数组,对象),不变的是内存地址,指向的数据结构可能会变动
const PI=3.14
console.log(PI) // const AB//报错,必须申明时同时赋值
// AB=1 const ABC=[]
ABC[0]='hello'
ABC[1]='hi'
console.log(ABC)
// ABC={}//这时报错
同时:ES6中,let,const,class申明的变量不再是顶层对象的属性;而var ,function申明的依然是顶层对象的属性(为了保持兼容性)
console.log(window.PI)//undefined;PI是上面代码中由const申明的常量
参考:更多详情请点击阮一峰前辈的ECMAScript 6 入门