ES6

ES6学习笔记0:let命令

Posted by mieruko on 2016-12-03

前言

看了一下Vue的文档后真的感叹啊现在ES6真是越来越普及了。之前只是零星地接触了一下，缺乏系统的学习。现在觉得很有必要学一下。接下来的博客主要是围绕阮一峰老师的《ES6入门》做教材，杂七杂八的博客做参考，然后自己做一个总结。

let命令之先撸两个demo

先来一个这样的: 

1
2
3
4
5
var a=1;
let b=2;

console.log("a:",a);
console.log("b:",b);

运行一下，直接输出a和b，没毛病。
从这里我们看出，let和var都可以声明一个变量。

再来： 

1
2
3
4
5
6
7
if(true) {
    var a = 1;
    let b = 2;
}

console.log("a:",a);
console.log("b:",b);

然后悲伤的事情发生了，b变成了未定义。

let命令之楼上到底是怎么回事？

这是因为var和let对“域”的限制不同。
var是啥？var只要没在函数里，就是全局。 在函数里，就是局部。
而这个let，遇到代码块，就是个域。
出了这个代码块，let定义的变量就找不着了。

除此之外，let在for语句中的情况比较常见。

let在for语句中

举个例子: 

1
2
3
4
for(var i=0;i<5;i++) {
    console.log("i:",i);
}
console.log("i:",i);

输出啥？？？
肯定顺序输出0到5啊。
然而我们对后来那个i＝5感兴趣吗？并不啊，我们只对参与循环的i感兴趣。
于是，我们把var改成let,我们就可以愉快地看到一个报错，说i未定义。
这就是let的用法之一。

变量提升有毒啊！！！let不用它！

变量提升是啥？？？？
不熟悉真要啪啪打脸了，回去刷红宝书吧你！！
不过既然说到了，还是要复习一下: 

1
2
console.log("a:",a);
var a;

你猜输出啥？？？
你猜会报错吗？？？？
不会啊朋友！！！
因为所有的声明都被提升到代码的最前面啦，所以console语句其实是在var后面执行的，于是我们输出的是一个undefined。
其实这样写还是有点不太规范，而且输出一个undefined也必定不是我们想要的结果，很可能会导致进一步的错误，那么我们可以让它直接跳红字告诉我们这里不对劲吗？？？？
当然可以啦。

所以如果你敢这么做: 

1
2
console.log("a:",a);
let a;

你的命运只能是被愉快地报错，因为let不存在变量声明的提升，所以console在a声明之前就执行了，那么它必定是找不到a的，于是就报错说你有一个未声明的变量呀！

结语

一开始想做个对比，不过想想其实没有必要。
因为根本不存在谁更好，只能说谁更合适，在具体的开发情境下。
所以需要做的就是对let和var的特性足够熟悉，这就够了，不需要过分解读出一些了不得的东西。
就是这样!

FEATURED TAGS
ES6