let 与块级作用域

Posted 2021-09-13 mcgee0731

• 块内变量外部无法访问

  if(true){
  let foo = "mcgee0731"
  }
  console.log(foo); //foo is not defined
  ...
  for(let i=0;i< 3;i++>){}
  console.log(i) //i is not defined

• var对循环的影响

  for(var i=0;i< 3;i++){
  for(var i=0;i< 3;i++){ 
    console.log(i);
  }
  }
  //内层循环完后 `i = 3` 到外层循环时,无法再进入。打印0，1，2三次而不是九次

  // 循环内处理事件时，事件内访问计数器
  var events = [{},{},{}]
  for(var i=0;i< events.length;i++){
  events[i].onclick = function(){
    console.log(i)
  }
  }
  events[0].onclick() //无论哪一项输出都是3

• 通过IIFE模式处理事件计数器绑定

  // 使用闭包处理变量
  var events = [{},{},{}]
  for(var i=0;i< events.length;i++){
  events[i].onclick = (function(i){
    return function(){
      console.log(i)
    }
  })(i)
  }
  events[0].onclick()  //0

• 使用let 解决 for循环的问题

  for(let i=0;i< 3;i++){
  for(let i=0;i< 3;i++){ 
    console.log(i);
  }
  }
  ...
  var events = [{},{},{}]
  for(let i=0;i< events.length;i++){
  events[i].onclick = function(){
    console.log(i)
  }
  }
  events[0].onclick() //0

• for循环内有两层作用域，我们对下面的方法进行拆解

for(let i =0;i < 3;i++){
  let i = "foo"
  console.log(i);
}

拆解成...

let i =0; //这是for循环的作用域 
if(i<3){
  let i = "foo" //这个n是块内的n，
}
i++

会执行三次

• 不存在变量提升

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

• 做一个小案例

每次都是在新词法作用域创建个str=""+每次的i

for(var i=0;i<1000;i++)
{
  let str = ""
  str+=i
}

• 为什么需要块级作用域

  • 变量提升导致报错
  • 内部变量泄露
  • 匿名立即执行函数表达式（IIFE）不再必要了

• 函数在块级作用域内

  • 允许在块级作用域内声明函数。
  • 函数声明类似于var，即会提升到全局作用域或函数作用域的头部。
  • 同时，函数声明还会提升到所在的块级作用域的头部。

const

• 只读的常量。一旦声明，常量的值就不能改变

  const PI = 3.1415;
  PI = 3;

• const声明不赋值报错

  const obj 

• const 对于对象，绑定对象的地址值并且无法改动，地址值内的属性成员可以改。
• ES2015声明的6种方法，var function let const import class
• 主用const ，需要改动的用let， 不用var