let和const命令总结

let命令

1. 使声明的变量只在代码块中生效

{
  let a = 10;
  var b = 1;
}
a //ReferenceError: a is not defined
b //1

在for循环中作用比较明显

for (let m = 0; m < 10; m++) {
  // ...
}

console.log(i);//报错

for (var i = 0; i < 10; i++) {
  // ...
}

console.log(i);//这个i是全局的，会输出10

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

//for循环的括号中是一个父级作用域，花括号中是单独的子作用域
for (let i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);
}

2.变量提升问题

• var声明的变量会发生变量提升，而let不会有这个问题
• 暂时性死区：如果区块中存在let或const命令，这些区块对这些命令声明的变量，从一开始就形成了封闭作用域（temporal dead zone，简称TDZ），凡是在声明之前使用这些变量就会报错

var temp = "aa";
if(true){
    temp = "bb";//ReferenceError
    let temp;
}


// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

3、不允许重复声明

//报错
function func(args){
   let a = 10;
   var a =1 ;
  
}

function func(args){
    let args;//Error
}

function func(args){
    {
        let args;//不报错
    }
}

块级作用域

为什么需要块级作用域

• es5只有全局作用域和函数作用域
• 内层变量可能会覆盖外层变量

var temp = 'abc';
function func(){
    console.log(temp);
    if(false){
        var temp ='hello world';
    }
};

func()//undefined

• 用来计数的循环变量泄露为全局变量
• 有了块级作用域后，外层作用域无法读取内层作用域中的变量，但内层作用域可以读取外层作用域中的变量
• 块级作用域的出现，实际上使得立即执行函数表达式不再必要

//IIFE写法
(function(){
    var a = ...
    ...
}());

//es6写法
{
    let a = ...

}

• es5规定函数只能在顶层作用域和函数作用域中声明，不能再块级作用域中声明，虽然浏览器并没有遵守这个规定，es6明确规定函数可以再块级作用域中声明，但考虑到兼容性，浏览器的处理有自己的行为方式： （1）、允许在块级作用域内声明函数 （2）、函数声明类似于var，即会提升到全局作用域或函数作用域的头部 （3）、函数声明还会提升到所在的块级作用域的头部

const命令

1. 声明一个只读的常量，一旦声明，其值就不能改变

• 一旦声明，必须立即初始化；
• 作用域与let相同，只在声明所在的块级作用域内有效；
• 变量也不提升，存在暂时性死区； -本质：const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指针，const只能保证这个指针是固定的，至于它指向的数据结构是不是可变的，就完全不能控制了。

const foo = {};

// 为 foo 添加一个属性，可以成功
foo.prop = 123;
foo.prop // 123

// 将 foo 指向另一个对象，就会报错
foo = {}; // TypeError: "foo" is read-only

//如果真的想将对象冻结，可以使用Object.freeze方法
const foo = Object.freeze({});

// 常规模式时，下面一行不起作用；
// 严格模式时，该行会报错
foo.prop = 123;


//讲对象的属性也冻结
var constantize = (obj) => {
  Object.freeze(obj);
  Object.keys(obj).forEach( (key, i) => {
    if ( typeof obj[key] === 'object' ) {
      constantize( obj[key] );
    }
  });
};

es6声明变量的六种方式

1. var、function、let、const、import、class