ES6小实验-let和const

一直想着写点东西把博客装满,但却不知道该写什么,一方面是觉得别人的博客写的已经足够好了,自己没必要写那些重复的东西,另一方面主要还是懒吧。现在却发现似乎有必要写点了,一是为了加深记忆,二也算我曾经飞过这片天空。虽然对别人来说是重复的东西,但对自己却是一个很好的总结。所以应该坚持写东西,坚持总结。今天就从ES6开始吧:

阮一峰大神写的ECMAScript 6入门写的已经足够详细,以下算是我自己看书的一些小实验吧。他首先介绍了ES6的let命令

1.let命令只在所在的代码块内有效。为此他提供了两个小例子:

第一个例子:

{
   let a = 10
   var b = 1      
}

console.log(a)//Uncaught ReferenceError: a is not defined
console.log(b)//1

从这里可以很明显的看出let声明的变量在代码块外部已经无效,但是var声明的变量在代码块外面依然有效。

第二个例子:

var a = [];
for(let i = 0; i < 10; i++){
  a[i] = function() {
     console.log(i);  
  }
}
a[6]()//6

这个例子中变量i是用let声明的,假如是用var声明的话,最后输出结果就会变为10,原因是:变量 i 是 var 声明的,在全局范围内都有效。所以每一次循环,新的 i 值都会覆盖旧值,导致最后输出的是最后一轮的 i 的值。而使用 let声明的变量仅在块级作用域内有效,不会覆盖旧值,所以最后输出的是 6 。用babel把它转化为ES5可以更清楚的看出差距:

"use strict";

var a = [];

var _loop = function _loop(i) {
  a[i] = function () {
    console.log(i);
  };
};

for (var i = 0; i < 10; i++) {
  _loop(i);
}
a[6](); //6

2.不存在变量提升

所谓变量提升就是变量可以先使用,然后再声明。var声明的变量是可以先使用后声明的,例如:

console.log(a)// undefined
console.log(b)// b is not defined
var a = 6
let b = 8

浏览器输出 undefined,没有报错。但如果用let声明的话会报错,所以在使用let声明的变量时,应该先声明在使用。

3.暂时性死区

我对它的理解是:只要块级作用域里面存在了一个let a ; 那么这个作用域的a变量就控制了这个区域,不管外面风云变幻,块内都稳如泰山,有点像当第一个精子进入了卵子后,卵子就屏蔽了其他精子的进入一样,要强行进入的话就会报错。举例:

var tmp = 123
if(true) {
    tmp = "abc"
    let tmp  = "go"
    console.log(tmp)//Uncaught ReferenceError: tmp is not defined
}

4.不允许重复声明

let 不允许在相同作用域内,重复声明同一个变量。这个简单,举例:

{
    let a = 10
    var a = 1
}//Uncaught SyntaxError: Identifier 'a' has already been declared

如果没有let的话,是可以重复声明同一个变量的,

{
    var a = 10
    var a = 1
    console.log(a)//1
}

这节就暂时写到这吧。

 

原文地址:https://www.cnblogs.com/fengz/p/6658670.html