let var const的区别

ES6 新增了let命令，用来声明变量。

一.let

（1）但是所声明的变量，只在let命令所在的代码块内有效。

  <script>
       {
          var a=10;
           let b=1;
       }
       console.log(a);//10
       console.log(b)//Uncaught ReferenceError: b is not defined


   </script>

（2）let不存在变量提升：它所声明的变量一定要在声明后使用，否则报错。var命令会发生“变量提升”现象，即变量可以在声明之前使用，值为undefined

1  <script>
2     console.log(c);
3     var c=2;
4     // 注意var 声明可以提前，没有获取值时为undefided
5     console.log(d);//Uncaught ReferenceError: d is not defined
6     let d=2;
7    
8 
9    </script>

let命令声明，不会发生变量提升。这表示在声明它之前，变量d是不存在的，这时如果用到它，就会抛出一个错误。变量c用var命令声明，会发生变量提升，即脚本开始运行时，变量c已经存在了，但是没有值，所以会输出undefined。

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

1   <script>
2   
3     // 注意：let不允许在相同作用域内，重复声明同一个变量
4     let d=2;
5     let d=4;
6     console.log(d)//es6.html:14 Uncaught SyntaxError: Identifier 'd' has already been declared
7 
8    </script>

function a() {
  let a = 10;
  var a = 1;
  console.log(a);
}
a();
function a() {
  let a1 = 10;
  let a1 = 1;
  console.log(a1);
}
a();

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

 <script>
  
function func1(arg) {
   let arg; // 报错
 }

function func2(arg) {
  {
    let arg; // 不报错
  }
}
   </script>

(4)存在暂时性死区：只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。

<script>
  
var tmp = 123;

if (true) {
  tmp = 'abc'; //ReferenceError: tmp is not defined
  let tmp;
}
</script>

上面代码中，存在全局变量tmp，但是块级作用域内let又声明了一个局部变量tmp，导致后者绑定这个块级作用域，所以在let声明变量前，对tmp赋值会报错。

ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。

ES6 规定暂时性死区和let、const语句不出现变量提升，主要是为了减少运行时错误，防止在变量声明前就使用这个变量，从而导致意料之外的行为。

二。const 命令

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

<script>
  
  const PI=3.14;
  console.log(PI);
  PI=2;//报错 const声明常量的值就不能改变
</script>

const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

<script>
  
  const PI;//Uncaught SyntaxError: Missing initializer in const declaration
</script>

上面代码表示，对于const来说，只声明不赋值，就会报错。

（2）const的作用域与let命令相同：只在声明所在的块级作用域内有效。

if (true) {
  const MAX = 5;
}

MAX // Uncaught ReferenceError: MAX is not defined

（3）const命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用。

if (true) {
  console.log(MAX); // ReferenceError
  const MAX = 5;
}

上面代码在常量MAX声明之前就调用，结果报错。

（4）const声明的常量，也与let一样不可重复声明。

var message = "Hello!";
let age = 25;

// 以下两行都会报错
const message = "Goodbye!";
const age = 30;

ES6 声明变量的六种方法

ES5 只有两种声明变量的方法：var命令和function命令。ES6 除了添加let和const命令，后面章节还会提到，另外两种声明变量的方法：import命令和class命令。所以，ES6 一共有 6 种声明变量的方法。

ES6 声明变量的六种方法

猜你喜欢