面试题:var、let、const的区别

news2024/11/27 8:39:52

var、let、const的区别

  • 一、提出
  • 二、作用域不同
    • 2.1 作用域
  • 三、变量提升
  • 四、重复声明
  • 五、可修改性
  • 六、初始值设置
  • 七、暂时性死区
  • 八、给全局添加属性
  • 总结
  • `若有错误,欢迎随时指正`

一、提出

var是ES5提出的,let和const是ES6提出的。

二、作用域不同

2.1 作用域

在ES6之前,作用域只有两种:全局作用域和函数作用域。
var声明的变量存在于下面两个作用域中

  • 全局作用域中的对象在代码的任何地方都能访问。
  • 函数作用域就是在函数内部定义的变量或者函数,并且定义的变量或者函数只能在函数内部被访问。而且函数执行结束之后,函数内部定义的变量会被销毁。

举个例子:

// 全局
var a = 10
console.log(a) // 10

const test = (c) => {
    var b = 20
    console.log(b) // 20,这个b在函数内声明
    console.log(c)
}

test(10) // 20 10
console.log(b) // 报错,b没有被声明

在这里插入图片描述

块级作用域就是使用一对大花括号 { } 包裹的一段代码。
比如:函数、判断语句、循环语句、甚至单独的一个 { } 都可以被看作是一个块级作用域。
let const 声明的变量就是块级作用域。
如下面的代码段就是块级作用域:

// 函数块
function fun() {}

// 判断语句块
if(true) {}

// 循环语句块
while(true) {}
for(let i=0; i<10; i++) {}

// 单独一个块
{}

三、变量提升

var存在变量提升,在声明之前访问变量不会报错,但其值为undefined。

console.log(a)
    a = 1
    console.log(a)
    var a

在这里插入图片描述

let和const不存在变量提升,即变量只能在声明之后使用,否则会报错。

console.log(a)
    a = 1
    console.log(a)
    let a
    console.log(a)

在这里插入图片描述

四、重复声明

在同一个作用域内,使用var声明的变量可以被重复声明,而使用let和const声明的变量不能被重复声明,否则会报错。

五、可修改性

使用const声明的变量是常量,其值在声明之后不能再被修改,但是使用let或var声明的变量的值可以被修改。

六、初始值设置

在声明变量时,var和let可以不用设置初始值,但是const声明变量必须设置初始值。

七、暂时性死区

  • 定义:let/const 命令会使区块形成封闭的作用域。若在声明之前使用变量,就会报错。
    在代码快内,使用let命令声明变量之前,该变量都是不可用的。这在语法上,称为“暂时性死区”
  • 结论:var不存在暂时性死区,let和const存在暂时性死区。

八、给全局添加属性

var声明的变量会挂载到window上,let和const声明的变量则不会

举个例子:

<script>
			var a = 1;
			console.log('a',window.a);
			
			let b = 2;
			console.log('b',window.b); 
			
			const c = 3;
			console.log('c',window.c);
		</script>

在这里插入图片描述

总结

建议在实际开发中尽可能使用let和const,以避免变量提升和重复声明等问题,并使代码更加易于维护。

在涉及到常量定义的情况下,建议使用const来声明变量,以便于识别和维护常量值。

若有错误,欢迎随时指正

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

大数据环境下保护个人隐私

近日&#xff0c;某高校毕业生在校期间窃取学校内网数据&#xff0c;收集全校学生个人隐私信息的新闻引发了人们对互联网生活中个人信息安全问题的再度关注。在大数据时代&#xff0c;算法分发带来了隐私侵犯&#xff0c;在享受消费生活等便捷权利的同时&#xff0c;似乎又有不…

webrtc源码阅读之h264 RTP打包

本文来分析webrtc打包h264 rtp包的代码&#xff0c;版本m98 一、RTP协议 1.1 RTP协议概述 实时传输协议&#xff08;RTP&#xff09;是一个网络协议&#xff0c;它允许在网络上进行实时的音频和视频数据传输。RTP协议主要用于解决多媒体数据的实时传输问题&#xff0c;特别是…

关于Java已死,看看国外开发者怎么说的

博主在浏览 medium 社区时&#xff0c;发现了一篇点赞量 1.5k 的文章&#xff0c;名称叫《Java is Dead — 5 Misconceptions of developers that still think Java is relevant today!》直译过来就是《Java 已死 — 开发人员对 Java 在现代编程语言中的5个误解》。这篇文章可以…

什么是倒排索引

什么是倒排索引 搜索的核心需求是全文检索&#xff0c;全文检索简单来说就是要在大量文档中找到包含某个单词出现的位置&#xff0c;在传统关系型数据库中&#xff0c;数据检索只能通过 like 来实现&#xff0c;例如需要在酒店数据中查询名称包含公寓的酒店&#xff0c;需要通…

k8s如何对外公布一个应用程序

一&#xff1a;Kubernetes Service&#xff08;服务&#xff09;概述 事实上&#xff0c;Pod&#xff08;容器组&#xff09;有自己的 生命周期 (opens new window)。当 worker node&#xff08;节点&#xff09;故障时&#xff0c;节点上运行的 Pod&#xff08;容器组&#x…

全网最细,Fiddler抓包实战教程-辅助接口测试(二)

目录&#xff1a;导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结&#xff08;尾部小惊喜&#xff09; 前言 Fiddler的功能面板…

超低色散非球面ED镜片——减少空三分层的“秘密武器”

引言 倾斜相机作为精密光学电子仪器&#xff0c;光学部件相当于它的眼睛&#xff0c;直接关系到原始航片采集质量的高低&#xff0c;其重要性不言而喻。优质的原始航片能够降低空三分层概率&#xff0c;增加空三解算的鲁棒性&#xff0c;从而提高内业效率&#xff0c;节约项目…

Vue3中使用vee-validate进行表单验证

官网&#xff1a;Checkbox and Radio InputsValidating checkboxes and Radio inputshttps://vee-validate.logaretm.com/v4/examples/checkboxes-and-radio/ 安装vee-validate npm i -S vee-validate 示例1&#xff1a; <template><Formref"ref_form"c…

旅游卡景区小程序购票核销分销app系统

旅游业的蓬勃发展&#xff0c;景区旅游卡也逐渐成为游客出行的常见选择。为了提升景区旅游卡的购买和使用体验&#xff0c;许多景区开始采用小程序来提供购票和核销服务。同时&#xff0c;为了更好地推广景区旅游卡&#xff0c;许多景区也开发了分销App系统&#xff0c;以提供更…

linux代码提交记录 linus亲手改代码

kernel/git/torvalds/linux.git - Linux kernel source tree

【Megatron-DeepSpeed】张量并行工具代码mpu详解(一):并行环境初始化

相关博客 【Megatron-DeepSpeed】张量并行工具代码mpu详解(一)&#xff1a;并行环境初始化 【深度学习】【分布式训练】DeepSpeed&#xff1a;AllReduce与ZeRO-DP 【深度学习】混合精度训练与显存分析 【深度学习】【分布式训练】Collective通信操作及Pytorch示例 【自然语言处…

DOM“文档对象模型”

目录 DOM 1.节点层级 1.2.节点 常用节点 文档节点&#xff08;document&#xff09; 元素节点&#xff08;Element&#xff09; 属性节点&#xff08;Attribute) 文本节点&#xff08;Text&#xff09; 其他节点 DocumentType Comment DocumentFragment 1.3.节点树…

力扣 501. 二叉搜索树中的众数

题目来源&#xff1a;https://leetcode.cn/problems/find-mode-in-binary-search-tree/description/ C题解1&#xff1a;使用中序遍历将二叉搜索树有小到大放进数组中&#xff0c;在寻找最大数组。 class Solution { public:void traversal(TreeNode* node, vector<int>…

操作系统7:进程死锁

目录 1、死锁概述 &#xff08;1&#xff09;计算机中的资源分类 1.1 - 可重用性资源和消耗性资源 1.2 - 可抢占性资源和不可抢占性资源 &#xff08;2&#xff09;计算机系统中的死锁 &#xff08;3&#xff09;死锁的定义、必要条件和处理方法 3.1 - 死锁的定义 3.2 …

运输层:TCP拥塞控制

1.运输层&#xff1a;TCP拥塞控制 笔记来源&#xff1a; 湖科大教书匠&#xff1a;TCP的拥塞控制 声明&#xff1a;该学习笔记来自湖科大教书匠&#xff0c;笔记仅做学习参考 网络资源&#xff1a;在计算机网络中的链路容量&#xff08;即带宽&#xff09;、交换结点中的缓存和…

windows 10 安装Python 3.10版

一、查找官网 1.python官网需要VPN(建立一个临时的、安全的连接&#xff0c;是一条穿过混乱的公用网络的安全、稳定的隧道。)&#xff0c;打开VPN进行代理之后&#xff0c;打开网址&#xff1a;https://www.python.org/ 二、查找所需下载的系统及版本 1.本机是winodws操作系统&…

计算机网络_ 1.3 网络核心 (数据交换_报文、分组交换)

计算机网络_数据交换_报文、分组交换 报文交换&#xff08;message switching&#xff09;分组交换&#xff08;package switching&#xff09;存储-转发&#xff08;store-and-forward&#xff09;传输延迟分组交换的报文交付时间 分组交换 vs 电路交换 报文交换&#xff08;m…

zabbix监控部署(都是导图!)

目录 一&#xff1a;监控软件的作用 二&#xff1a;zabbix 简介 1、zabbix 概述 2、zabbix 监控原理 3、 Zabbix 6.0 新特性 &#xff08;1&#xff09;Zabbix server高可用防止硬件故障或计划维护期的停机 &#xff08;2&#xff09;Zabbix 6.0 LTS新增Kubernetes监控功…

C语言入门篇(二)

前言   续接上一篇文章&#xff0c;此篇继续对&#xff23;语言的基础知识点进行更新。 C语言入门篇&#xff08;一&#xff09; 初始C语言 7. 选择语句8. 循环语句9. 函数9.1 函数的定义9.2 函数的调用 10. 数组10.1 数组定义10.2 数组的下标10.3 数组的使用 11. 操作符12.…