【ES6】let与const

news/2024/7/10 23:44:20 标签: es6, 前端, javascript

目录

let命令

作用域 

无变量提升 

不允许重复声明

 暂时性死区

块级作用域 

函数能否在块级作用域中声明 

 const命令


let命令

作用域 

ES6 新增了let命令,用来声明变量。它的用法类似于var,但是作用域不同,let命令只在所在的代码块内有效。举个例子:

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

上面代码在代码块之中,分别用letvar声明了两个变量a和b。在代码块之外调用这两个变量,结果变量a报错,变量b返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。

所以for循环就很适合用let,而且for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域。例:

for (let i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);
}
// abc
// abc
// abc

上面代码正确运行,并且输出了 3 次abc。这表明函数内部的变量i与循环变量i不在同一个作用域,有各自单独的作用域(同一个作用域不可使用 let 重复声明同一个变量)。

无变量提升 

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

而let所声明的变量一定要在声明后使用,否则报错。 例:

console.log(foo); // 输出undefined
var foo = 2;

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

不允许重复声明

简而言之就是不允许在相同作用域内,重复声明同一个变量。这个很好理解。例:

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

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

 暂时性死区

ES6 明确规定,如果区块中存在letconst命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。也就是说,在代码块内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”(temporal dead zone,简称 TDZ)。例:

if (true) {
  // TDZ开始
  tmp = 'bb'; // ReferenceError
  console.log(tmp); // ReferenceError
  let tmp; 
  // TDZ结束
  console.log(tmp); // undefined
  tmp = aa;
  console.log(tmp); // aa
}

 上面代码中,在let命令声明变量tmp之前,都属于变量tmp的“死区”。

块级作用域 

let为 JavaScript 新增了块级作用域,且ES6允许块级作用域的任意嵌套。 

{
  {
    let a = 'b'
    {
      let a = 'a'
      console.log(a) // a
    }
    console.log(a) // b
  } console.log(a) // 报错
}

上面代码有3层块级作用域,每一层都是一个单独的作用域,因此外面的作用域无法读取内部作用域的变量。但是内部作用域可以定义外部作用域变量。

函数能否在块级作用域中声明 

ES5 规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。但是,浏览器没有遵守这个规定,为了兼容以前的旧代码,还是支持在块级作用域之中声明函数,不会报错。

ES6 引入了块级作用域,明确允许在块级作用域之中声明函数。ES6 规定,块级作用域之中,函数声明语句的行为类似于let,在块级作用域之外不可引用。

 const命令

const命令有以下几个特点: 

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

const一旦声明变量,就必须立即初始化,不能留到以后赋值。 

const的作用域与let命令相同:只在声明所在的块级作用域内有效。(参考上面let命令)

const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。 (参考上面let命令)

const声明的常量,也与let一样不可重复声明。 (参考上面let命令)

注:const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。 

关于const命令就不举例说明了,建议自行尝试


http://www.niftyadmin.cn/n/5435575.html

相关文章

2024全国水科技大会:【协办单位】山东文远环保科技股份有限公司

山东文远环保科技股份有限公司坐落于千年古城齐国故都--临淄。初始成立于2011年&#xff0c;是淄博市首批国有资本参股的混合改制企业。 公司着力打造环保设备制造、环保工程及服务、环保水务/固废处理/新能源项目投资及运营管理、固废循环经济产业园等四大板块。是一家集投资、…

Flutter 开发中踩坑笔记总汇

Flutter 踩坑笔记总汇 本篇主要是收集汇总开发过程中遇到的小困惑&#xff0c;都是些比较常见的问题。后续开发中遇到&#xff0c;也会持续更新在这里。 1、Flutter Packages upgrade后任务进入阻塞状态 问题&#xff1a;无法更新下载插件库。 解决&#xff1a;配置flutter官…

深度学习——微积分基础

目录 1、导数和微分 1.1 定义函数&#xff1a; 1.2 趋近过程&#xff1a; 1.3 绘图表示&#xff1a; 2、偏导数 3、梯度 4、链式法则 5、学习心得 在2500年前&#xff0c;古希腊人把一个多边形分成三角形&#xff0c;并把它们的面积相加&#xff0c;才找到计算多边形面积…

JavaWeb基础第四章(SpringBootWeb工程,HTTP协议与Web服务器-Tomcat)

文章目录 一、SpringBoot介绍二、SpringBootWeb入门三、HTTP协议四、HTTP-请求协议五、HTTP-响应协议六、HTTP-协议解析七、Web服务器-Tomcat八、Tomcat — 基本使用九、入门程序解析 在这篇文章中&#xff0c;我们将深入探讨一种广受欢迎的Java框架 - SpringBoot。可能你已经听…

【每日一题】2024年3月汇编(上)

3.1【2369】检查数组是否存在有效划分 2369. 检查数组是否存在有效划分https://leetcode.cn/problems/check-if-there-is-a-valid-partition-for-the-array/ 1.这样的判断可以用动态规划来解决&#xff0c;用一个长度为(n1) 的数组来记录 是否存在有效划分&#xff0c;dp[i]…

Debug追踪

2.2 Debug追踪 使用IDEA的断点调试功能&#xff0c;查看程序的运行过程 在有效代码行&#xff0c;点击行号右边的空白区域&#xff0c;设置断点&#xff0c;程序执行到断点将停止&#xff0c;我们可以手动来运行程序 点击Debug运行模式 程序停止在断点上不再执行&#xff0c…

Vue+SpringBoot打造康复中心管理系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 普通用户模块2.2 护工模块2.3 管理员模块 三、系统展示四、核心代码4.1 查询康复护理4.2 新增康复训练4.3 查询房间4.4 查询来访4.5 新增用药 五、免责说明 一、摘要 1.1 项目介绍 基于JAVAVueSpringBootMySQL的康复中…

微信开发者工具如何使用?使用注意事项

&#xff08;1&#xff09;单位如何进行换算&#xff1f; 1 px 750/屏幕宽度 rpx 1 rpx 屏幕宽度/750 px &#xff08;2&#xff09;如何新建文件&#xff1f; 1> 点开app.json 2> 在“pages/index/index”后面接“&#xff0c;pages/自定义文件夹名/自定义文件名”…