ECAMScript中的let和const

当前位置:

首页 > temp > JavaScript教程 >

ECAMScript中的let和const

let与const命令都是用来在js中声明变量的，在使用上与var相似，但存在一些区别，下面先讲let同var的区别

let

怎么使用呢，同var一样，let 变量名就可以声明了

区别一：其作用域只能在当前执行的代码块中，

{
    let a=12;
    var b=12;
    console.log(a+"=="+b);//a==>12   b==>12
}
console.log(a);// ReferenceError: a is not defined
console.log(b);//12

上面的例子中，let在代码块中声明后，在代码块外引用就会报错，其作用范围只限制在{ }里面，有点跟函数的局部变量相似

我们可以发现这种做法挺适用于for循环中，这样子可以做到在循环中的i不会被后面的代码引用到

for(var i=0;i<6;i++);
console.log(i);//6
for(let j=0;j<6;j++);
console.log(j);//Uncaught ReferenceError: j is not defined

区别二：不能在同一个作用域内重复声明一个变量

我们知道用var声明变量的时候可以重复声明，只是会改变数据存储的指向，最直观的例子就是for循环的时候习惯性重复用var i 吧

但是let不允许重复声明，下面代码运行时会报错

//报错
{
    var a=12;
    let a=1;
}

区别三：let声明的变量不会进行预编译，即将变量的声明提前至代码前面

console.log(a);//undefined
var a=2;

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

区别四：暂时性死区(TDZ)，let变量声明的代码块中，其同名的全局变量（代码块外声明的var）不会产生任何作用（简单说就是被无视掉了）

{
    var a=12;
    let a=11;
    console.log(a);//报错，因为在用let声明时，已经声明了标识符a
}

var b=12;
{
    let b=11;
    console.log(b);//11
}

{
  tmp = 1; // 报错
  console.log(tmp); // 报错

  let tmp; 
  console.log(tmp); // 报错
  tmp = 1;
  console.log(tmp); // 1
  }

const

const用来声明一个只读的变量，声明后变量不能改变

下面开始一一说明：

首先const声明时必须初始化，且声明后不能重新赋值，否则都会报错

const a;//报错，未初始化

const b=1;
b=2;//报错，重复赋值

其次，const与let在下面方面有相似之处：

const的作用域同样作用于声明的代码块中

{
    const c=1;
}
console.log(c);//报错，为声明定义

const在同一个作用域中不能重复声明

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

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

const不会进行预编译（声明的变量提前）

{
    console.log(d);//报错
    const d=1;
}

const同样存在暂时性死区

var  a=12;
{
   const a= 1;
   console.log(a);//1 
      
}

接下来对其变量值声明后不能改变补充说明：这里的不能改变指的是变量指向的地址不会发生改变

所以对于用const声明的数组和对象，可以向其添加元素或者属性，因为这些操作不会改变其本来变量指向的地址，但是重新赋值一个数组或者对象无论是啥都会报错

const obj={};
obj.pro=1;//可以成功添加
console.log(obj.pro);//1
obj={};//报错

const arr=[];
arr.push(1);
console.log(arr);//[1]
arr=['df'];//报错

栏目列表