var与let

ES6对比ES5（let与var）

最为一个前端摆烂小伙，在学习的道路上一定会面临一个比较现实的问题。这个问题其实说大不大说小不小。但是由于现在的行业内卷，你不得不抓住任何一个提升的机会，你不提升就会刷下去。

ES6依然成为现在前端开发的一个行业标准，由于浏览器对ES6 绝大多数的特性都已经支持，所以学习ES6对我们来说还是有必要的。尤其是对于之前一直使用Es5语法的一些程序员来说，突然地修改书写习惯，肯定会有点不太习惯。我的观点是可以学习作为了解，你可以不用但是你还是需要知道里面的一些原理和特性，毕竟现在ES5还没有退出历史的舞台。

1.var、let、const和block的块级作用域

在ES5的时候我们定义变量一般就只是用var来定义就比较的有局限性

var与let区别重要是：

（1）var是不具备块级作用域的

在函数中使用var来声明的话，在整个函数内部都是有效可以访问的，但是let是块级作用域只在作用域内可以访问的到

（2）是否可以在定义前访问该变量

let 不能在定义前来使用该变量，但是var可以不用提前定义。而且let必须声明才能使用，而var可以先用后声明，但是在没有声明的时候，访问的值只是unfedined

（3）变量提升

对比let，var会有一个变量提升的过程，当整个的函数作用域被创建的生后，var被定义的变量就会被创建，如没有初始化的话，就会默认初始化为undefined

console.log(a); 
​
var a = 13;
​
//结果：
​
//相当于undefined
​
var a;      // 只声明没有赋值，默认为undefined
console.log(a);
a = 13;

 

（4）this的指向问题

由于ES6加入了块级作用域就导致了this的指向被限制指向作用域内部，也就是指向自身。

 <script>
        let name = "tom"
​
        function fn() {
            console.log(this.name); //undefind
        }
        fn();
    </script>

结果：undefined

<script>
        var name = "tom"
​
        function fn() {
            console.log(this.name); //tom
        }
        fn();
    </script>

结果：这里打印出来的是tom

（5）let不能 重新被定义，但是var可以

还是因为作用域的问题，let定义的变量不能在一个作用域中重新被定义。

console.log(1)  // => 这行代码就已经不会执行了
let a = 12
console.log(a)
let a = 13      // => 此行出错：SyntaxError: Identifier 'a' has already been declared
console.log(a)