ES6-2【块级作用域与嵌套、let、暂行性死区】

一.let与暂行性死区

kiss原则  keep it simple stupid

(1).let三规则

1.let在同一作用域下不可重复声明

报错示例:

function test(){
    let a =1;
    var a =2;
}
test();

function test(a){
    let a = 10;
    console.log(a);
}
test();

演示示例:

function test(a){
    {
        let a =10;
        console.log(a); //10
    }
    console.log(a);//undefined
}

2.let不会提升，会产生一个暂时性死区

报错示例

console.log(a);
let a = 10; 

var a = a;
console.log(a); // un

let b = b;
console.log(b);//报错

//证明typeof不再安全
console.log(typeof(a))
let a

演示示例

function test(x=y,y=2){
    console.log(x,y);
}//报错
function test(x=2,y=x){
    console.log(x,y)
}//不会报错输出2，2

3.let只能在当前的块级作用域下生效

示例

{
    let a =2;
}
console.log(a); //报错

//注意这是个坑
for(;1;){
    let a = 1;
}
console.log(a);//这样不报错，因为就一直在循环，是个坑
//第二坑
var arr = [];
for(var i = 0; i<10;i++){
    arr[i] = function(){
        console.log(i);
    }
}
for(var i = 0; i<10;i++){
    log(arr[i]());
}
//这样打印的是0-9不牵扯闭包，只是在同一个作用域下第二个i会再次覆盖

var arr = [];
for(let i = 0; i<10;i++){
    arr[i] = function(){
        console.log(i);
    }
}
for(var k = 0; k<10;k++){
    log(arr[k]());
}
//0-9
var arr = [];
for(let i = 0; i<10;i++){
    arr[i] = function(){
        console.log(i);
    }
}
for(var i = 0; i<10;i++){
    log(arr[i]());
}
//0-9


for(let i = 0; i<10; i++){
    
}

console.log(i)//会报错

嵌套示例
 

(){}在同一个作用域
for(var i = 0; i<10; i++){
    var i = 'a';
    console.log(i);
}
输出a
for(var i = 0; i<10; i++){
     i = 'a';
    console.log(i);
}
输出a

//可以拿到i得值
for(let i = 0; i<10; i++){
     i = 'a';
    console.log(i);
}
输出a

//这样又报错
for(let i = 0; i<10; i++){
    var i = 'a';
    console.log(i);
}
这到底是为什么呢？到底是不是在同一个作用域下呢？一会变量提升 一会却又触发了第一个条件

//输出了10个10 所以证明了一点 如果用Let是不在一个作用域得，这就叫做父子级嵌套
for(let i = 0; i<10;i++){
    let i = 'a';
    console.log(i);
}
//因为var 会提升所以导致和父级的冲突，而let不会提升，则就是独立的作用域有一点
//点立即执行函数的意思

if(1){
    let a =1;
    {
        let a =10;
        console.log(a);
    }
    console.log(a);
}
输出 1o ,1

总结：let本质上就是为了js增加了一个块级作用域

块级作用域补充知识

块级作用域中可以嵌套函数声明了es6开始合法

{
    function (){}
}
应用:
if(i){
    function test(){}
}    

try{
    function test(){}
}catch(e){
    function test(){}
}

//但是遇到这种情况其实是不友好的，不建议使用函数申明这么做，
//建议用函数字面量表达式的方式
try{
   var test =  function (){}
}catch(e){
     var test =  function (){}
}

块级作用域没有返回值

if(1){
    return a
} //返回不出去得