【前端知识】JavaScript——var 与 let 的区别

【前端知识】JavaScript——var 与 let 的区别

  1. var声明的变量会自动提升到函数作用域顶部,而let不会。

    在解析代码时,JavaScript 引擎会注意出现在块后面的 let 声明,只不过在此之前不能以任何方式来引用未声明的变量。在 let 声明之前的执行瞬间被称为暂时性死区(temporal dead zone),在此阶段引用任何后面才声明的变量都会抛出 ReferenceError。

image-20230717140334312

  1. let的声明的范围是块作用域,而var声明的范围是函数作用域

    如下图,变量x_let之所以不能在 if 块外部被引用,是因为它的作用域仅限于该块内部。而由于x_var的作用域为整个函数,所以它能够在if块外部被引用。

image-20230717140855572

  1. let不允许许同一个块作用域中出现冗余声明,而var允许。

image-20230717141553176

  1. let 在全局作用域中声明的变量不会成为 window 对象的属性,而var 声明的变量则会。
var x_var = 'x_var'; 
console.log(window.x_var); // 'x_var' 
let x_let = 'x_let'; 
console.log(window.x_let); // undefined
  1. let 不能用于条件声明,而var可以。
<script>// 假设脚本不确定页面中是否已经声明了同名变量// 针对var: 它可以假设还没有声明过,因为多个重复声明可以被作为一个提升声明来处理var name = 'Matt'; // 针对let: 它的作用域为块,不会检查之前是否声明过同名变量,如果 age 之前声明过,则会报错let age = 36; 
</script>

使用 try/catch 语句或 typeof 操作符也不能解决,因为条件块中 let 声明的作用域仅限于该块:

<script>  if (typeof name === 'undefined') { let name; } // 上面的 name 被限制在 if {} 块的作用域内,因此这个赋值形同全局赋值name = 'Matt'; try { console.log(age); // 如果 age 没有声明过,则会报错} catch(error) { let age;} // age 被限制在 catch {}块的作用域内,因此这个赋值形同全局赋值
</script>
  1. 在for循环中,若迭代变量采用var声明,会渗透到循环体外,而let则无此问题

image-20230717151009612

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/28119.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL-DQL-案例

案例 案例1 根据需求完成员工管理的条件分页查询 具体代码 -- 案例1&#xff1a;按需求完成员工管理的条件分页查询 - 根据输入条件&#xff0c;查询第一页数据&#xff0c;每页展示10条记录 -- 输入条件&#xff1a; -- 姓名&#xff1a;张 -- 性别&#xff1a;男 -- 入职时间…

NAT 地址转换路由器配置命令(华为路由器)

#AR1路由器配置 # acl 2000 rule permit source any # interface GigabitEthernet0/0/1 nat outbound 2000 ip address 1.1.1.1 24 # interface GigabitEthernet0/0/0 ip address 172.16.1.1 255.255.255.0 # ip route-static 0.0.0.0 0.0.0.0 1.1.1.2 ip route-static …

怎么进行流程图制作?分享几种绘制方法

怎么进行流程图制作&#xff1f;流程图是一种图形化表示流程的图表&#xff0c;通常用于描述业务、计划或工作流程。它可以帮助人们更好地理解复杂的流程&#xff0c;并且提供了一种清晰的方法来记录和共享流程信息。下面介绍一些绘制流程图的方法&#xff0c;可以帮助我们快速…

Authing 入选长城战略咨询《2023 中国潜在独角兽企业》报告

2023 年 6 月 20 日&#xff0c;长城战略咨询&#xff08;GEI&#xff09;发布《2023 中国潜在独角兽企业研究》报告。Authing 作为国内首家身份云&#xff08;IDaaS&#xff09;厂商入选中国潜在独角兽企业榜单。独角兽企业指具有发展速度快、数量稀少、备受投资者青睐等属性的…

react 初学(1)

1.安装环境 需要Node.js 自行下载安装 然后全局安装create-react-app npm install -g create-react-app 如果出现报错请参考 create-react-app -V 报错无法将“create-react-app”项识别为 cmdlet、函数、脚本文件或可运行程序的名称_Java-请多指教的博客-CSDN博客 2.创建…

HTTP1.1、HTTPS、HTTP2.0 、HTTP3.0

HTTP1.1 优点&#xff1a; 整体方面&#xff1a;简单、灵活和易于扩展、应用广泛和跨平台 性能方面&#xff1a;长连接、管道网络传输解决请求队头阻塞&#xff08;没有使用&#xff09; 缺点&#xff1a; 安全方面&#xff1a;无状态、明文窃听、伪装、篡改 性能方面&am…

【NLP】多头注意力概念(02)

接上文: 【NLP】多头注意力概念(01) 五、计算注意力 将 Q、K 和 V 拆分为它们的头部后,现在可以计算 Q 和 K 的缩放点积。上面的等式表明,第一步是执行张量乘法。但是,必须先转置 K。 展望未来,每个张量的seq_length形状将通过其各自的张量来识别,以确保清晰…

抽象工厂模式

在开发一款游戏时&#xff0c;我们需要开发按钮Button及展板Board等组件&#xff0c;我们有多种风格Ligth或Dark&#xff0c;不同风格下组件的颜色、形状也不相同。如果按照工厂方法模式&#xff0c;则设计如下&#xff1a; 图 工厂方法模式实现上述需求 以上方法存在两个问题…

自动化测试工具比传统测试工具的优势体现在哪里?

随着软件行业的快速发展和扩张&#xff0c;自动化测试工具在提高测试效率和质量方面起到了不可或缺的作用&#xff0c;那你知道自动化测试工具比传统测试工具的优势体现在哪里吗&#xff1f; 首先&#xff0c;自动化测试工具能够大大缩短测试周期。相比于传统手动测试&#xff…

学习系统编程No.31【多线程互斥与同步】

引言&#xff1a; 北京时间&#xff1a;2023/7/16/14:32&#xff0c;摆烂至今&#xff0c;在耍这方面&#xff0c;谁能比我行&#xff0c;哈哈哈&#xff0c;乐观&#xff01;欠了一堆课要补&#xff0c;等我们把线程相关知识学完&#xff0c;对于系统编程方面我们搞定的就差不…

go语言终端交叉编译的事项windows编译其它平台软件包

交叉编译的终极版本[以此为准]&#xff1a; windows编译窗口目前分为cmd窗口&#xff0c;powershell窗口&#xff0c;这两个里面运行的命令不一样。 1.cmd窗口编译&#xff1b; 在windows10之前的系统版本上使用cmd命令行可以使用命令 CMD命令行中 在CMD命令行中编译&#…

【Unity 实用插件篇】| ReferenceFinder 引用查找插件,提高引擎查找使用效率

前言 【Unity 实用插件篇】| ReferenceFinder 引用查找插件&#xff0c;提高引擎查找使用效率一、ReferenceFinder 介绍二、使用示例三、实现方案3.1 方案选择3.2 查找及缓存3.3 界面实现 总结 前言 ReferenceFinder 是一个比较小众的插件&#xff0c;主要用来查找资源引用和…