[ES6] let和var区别

Posted 2022-12-21

1.使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象；
2.使用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升；
3.let不允许在相同作用域内，重复声明同一个变量。

  let a = 125;
  var b = 521;

a // Uncaught ReferenceError: a is not defined
b // 521

let配合for循环的应用

for (let i = 0; i < 5; i++) 
  console.log(i); //0 1 2 3 4 

console.log(i); //ReferenceError: i is not defined

上面代码中，计数器i只在for循坏体内有效，再循环体外引用就会报错。

下面是常见的面试题目:

for (var i = 0; i <10; i++)   
    setTimeout(function()   // 同步注册回调函数到 异步的 宏任务队列。
         console.log(i);        // 执行此代码时，同步代码for循环已经执行完成
      , 0);

// 输出结果

//10   共10个

如果把 var改成 let声明：

// i虽然在全局作用域声明，但是在for循环体局部作用域中使用的时候，变量会被固定，不受外界干扰。

for (let i = 0; i < 10; i++)  
  setTimeout(function() 
    console.log(i);    //  i 是循环体内局部作用域，不受外界影响。
  , 0);

// 输出结果：
0  1  2  3  4  5  6  7  8 9

另外，for循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域。

for (let i = 0; i < 3; i++) 
  let i = love;
  console.log(i);

// love
// love
// love

上面代码正确运行，输出了 3 次love。这表明函数内部的变量i与循环变量i不在同一个作用域，有各自单独的作用域。

不存在变量提升

var命令会发生”变量提升“现象，即变量可以在声明之前使用，值为undefined。

let命令则不同，它所声明的变量一定要在声明后使用，否则报错。

// var 的情况
console.log(ar); // 输出undefined
var ar = 512;
    
// let 的情况
console.log(et); // 报错ReferenceError
let et = 512;

上面代码变量ar用var声明，会发生变量提升，因没有值，所以会输出undefined。变量et用let声明的则不会发生变量提升

不允许重复声明

let不允许在相同作用域内，重复声明同一个变量。

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


// 报错
function func() 
  let a = 10;
  let a = 1;

因此，不能在函数内部重新声明参数。

function func(arg) 
  let arg; // 报错


function func(arg) 
  
    let arg; // 不报错
  

---

参考：
​​​ https://www.jianshu.com/p/84edd5cd93bd​​