ES6特性之:let和const

简介: 只能赋值一次的常量 constES6之前,我们只有一种声明变量的方式:var,不能声明常量,如果我们有一些不变的值,比如一些固定的错误代码,我们可能会这样去声明,把它们当做常量来使用:var ERROR_NETWORK = 0;var ERROR_NO_RESPONSE = 1;var ERROR_DATA_FORMAT = 2;我们不希望其他代码去改变这些变量的值,但是其实是没有办法做到的。

只能赋值一次的常量 const

ES6之前,我们只有一种声明变量的方式:var,不能声明常量,如果我们有一些不变的值,比如一些固定的错误代码,我们可能会这样去声明,把它们当做常量来使用:

var ERROR_NETWORK = 0;
var ERROR_NO_RESPONSE = 1;
var ERROR_DATA_FORMAT = 2;

我们不希望其他代码去改变这些变量的值,但是其实是没有办法做到的。

在ES6里,终于新增了const关键字,可以用于声明真正的常量啦:

const ERROR_NETWORK = 0;
const ERROR_NO_RESPONSE = 1;
const ERROR_DATA_FORMAT = 2;

如果你尝试对声明的常量重新赋值,则我们的开发工具的代码检查会报错,或者运行时也会报错:

错误

作用域更清晰的变量 let

我们使用var声明变量的时候,在同一个作用域中,可以重复声明一个变量:

var a = 1;
var a = 2;

console.log(a); // 结果:2

这个例子还好,我们一眼就能看出结果是2。那我们再来看一下下面这个例子:

var i = 100;

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

console.log(i);   // 100? 22?

其实常理来说,我们希望这里例子中输出结果是100。但是,其实这里输入的会是22。因为在for循环中声明的同名变量i并不会跟我们想象中似的,作用域只在for循环体中,它会影响到循环外的作用域。

所以,为了避免这种副作用,我们通常就只能声明一个其他名字的变量来解决了。

在ES6中,现在引入了一个新的关键字let,来更好的处理以上我们遇到的问题。

  • 在同一个作用域中,一个变量名只能声明一次。
let a = 1;
let a = 2; //错误
  • 变量只在自己所处的块(block)中起作用
let a = 1;

{
  //这里是一个block,所以可以再次声明变量a
  let a = 2;
  console.log(a); // 结果:2
}

console.log(a); // 结果:1

所以,回过头来再看上面那个循环的例子,通过使用let声明变量i后,就可以达到我们设想的效果了:

let i = 100;

for(let i = 0; i < 22; i++) {
   //...
}

console.log(i);   // 100
目录
相关文章
|
3月前
|
JavaScript 前端开发
ES6学习(1)let,const
ES6学习(1)let,const
|
6月前
|
前端开发 JavaScript 开发者
ES6 标准之 let、const 详解
ES6 为JavaScript带来了许多强大的新特性,使开发者能够编写更加简洁、清晰和高效的代码。let和const作为新的变量声明方式,提供了更严格的作用域控制和不可变性,有助于减少错误和提高代码质量。
80 2
ES6 标准之 let、const 详解
|
7月前
|
JavaScript IDE 开发工具
es6学习笔记(一)let、const
es6学习笔记(一)let、const
|
7月前
|
JavaScript 前端开发
JavaScript开发中ES6+新特性:介绍一下let和const与var的区别。
JavaScript开发中ES6+新特性:介绍一下let和const与var的区别。
60 1
|
7月前
|
Web App开发 JavaScript 前端开发
【ES6系列第一篇】ES6简介与特性、let、const、解构赋值
【ES6系列第一篇】ES6简介与特性、let、const、解构赋值
60 0
|
JavaScript 前端开发 安全
ES6(let和const命令)
ES6(let和const命令)
83 0
|
JavaScript 前端开发
ES6——let、const
ES6——let、const
116 0
|
JavaScript 前端开发
【ES6】 let与const详解
【ES6】 let与const详解
|
JavaScript 前端开发 安全
ES6 let 和 const 的使用跟区别,超详细讲解(看这一篇就够了)(二)
ES6 let 和 const 的使用跟区别,超详细讲解(看这一篇就够了)(二)
147 0