JavaScript 中 let 和 var 的区别

news2024/10/2 16:30:58

image-20230811170942387


首先,let 和 var 都是用于声明变量的关键字,在老版 JavaScript 中也许你会见到 var 方式来声明变量,而现如今几乎都是使用 let 进行声明,接下来看看这两个关键字之间的区别。

1、作用域

  • var

    var 声明的变量在函数内部有效,如果在函数内部使用 var 声明一个变量,那么该变量在整个函数内部都是可见的。

    function example() {
      var x = 10;
      if (true) {
        var y = 20;
        console.log(x); // 输出: 10
      }
      console.log(y); // 输出: 20
    }
    
  • let

    let 声明的变量在块级作用域内有效,如果在块级作用域内使用let声明一个变量,那么该变量只在该块级作用域内可见。

    function example() {
      let x = 10;
      if (true) {
        let y = 20;
        console.log(x); // 输出: 10
      }
      console.log(y); // 报错: ReferenceError: y is not defined
    }
    
  • 小结

    使用 var 声明的变量具有函数作用域,而使用 let 声明的变量具有块级作用域。

2、变量提升

  • var

    var声明的变量会在其作用域内的顶部被提升,即可以在声明之前使用变量。

    console.log(x); // 输出: undefined
    var x = 10;
    
  • let

    let声明的变量不会被提升,即在声明之前使用变量会导致引用错误。

    console.log(x); // 报错: ReferenceError: x is not defined
    let x = 10;
    
  • 小结

    使用 var 声明的变量存在变量提升,而使用 let 声明的变量不存在变量提升。

3、重复声明

  • var

    使用var重复声明同一个变量不会报错,而是会覆盖之前的值。

    var x = 10;
    var x = 20;
    console.log(x); // 输出: 20
    
  • let

    使用let重复声明同一个变量会导致语法错误。

    let x = 10;
    let x = 20; // 报错: SyntaxError: Identifier 'x' has already been declared
    
  • 小结

    使用 var 可以重复声明同一个变量,而使用 let 不允许在同一个作用域内重复声明同一个变量。

—END

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

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

相关文章

【什么是应变波齿轮又名谐波驱动?机器人应用的完美齿轮组!?】

什么是应变波齿轮又名谐波驱动?机器人应用的完美齿轮组!? 1. 什么是应变波齿轮?2. 工作原理3. 应变波齿轮 – 谐波驱动 3D 模型4. 3D 打印应变波齿轮 – 谐波驱动5. 总结 在本教程中,我们将学习什么是应变波齿轮&#…

关于使用 heatmap.js创建热力图并应用在cesuim上的坐标定位问题

废话少说&#xff0c;heatmap.js的用法我不在赘述&#xff0c;此文主要解决其热力点坐标定位在cesuim上的问题。 热力图容器 我们知道&#xff0c;热力图需要用有一个容器节点来存放它生成的图片&#xff1a;<div class"div-heatMap"></div> 而其中容器…

【ElasticSearch入门】

目录 1.ElasticSearch的简介 2.用数据库实现搜素的功能 3.ES的核心概念 3.1 NRT(Near Realtime)近实时 3.2 cluster集群&#xff0c;ES是一个分布式的系统 3.3 Node节点&#xff0c;就是集群中的一台服务器 3.4 index 索引&#xff08;索引库&#xff09; 3.5 type类型 3.6 doc…

360安全卫士右下角广告弹窗太多怎么彻底关闭?

360安全卫士右下角广告弹窗太多怎么彻底关闭&#xff1f; 1、卸载360安全卫士&#xff0c;选择继续卸载&#xff0c;并点击下一步&#xff1b; 2、选择广告弹窗太多&#xff0c;并点击下一步&#xff1b; 3、然后被告知升级极速版永久去广告&#xff0c;可以点击一键去广告。 …

全网超全,接口自动化测试-动态数据生成/替换数据(实战应用)

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

拂袖一挥,zipfile秒列zip包内容

使用wxpython列出文件夹中的zip文件及内容 最近在做一个文件管理的小工具,需要列出选择的文件夹下的所有zip压缩文件,并在点击某个zip文件时能够显示其中的内容。为此我使用了wxpython来实现这个功能。 1. 导入需要的模块 首先导入程序需要的模块: import wx import os imp…

【C++面向对象】--- 继承 的奥秘(上篇)

个人主页&#xff1a;平行线也会相交&#x1f4aa; 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 平行线也会相交 原创 收录于专栏【C之路】&#x1f48c; 本专栏旨在记录C的学习路线&#xff0c;望对大家有所帮助&#x1f647;‍ 希望我们一起努力、成长&…

git强推覆盖其他项目分支

git强推分支&#xff0c;覆盖其他分支&#xff1b; 操作&#xff1a; 下载branch-1.3代码&#xff1b; $ git clone gitlabgitlab.zte.net:zte-dba-service/branch.git $ git remote add origin2 gitlabgitlab.zte.net:zte-service/branch.git $ git push origin2 master -f注…

UE 5 GAS 在项目中处理AttributeSet相关

这一篇文章是个人的实战经验记录&#xff0c;如果对基础性的内容不了解的&#xff0c;可以看我前面一篇文章对基础的概念以及内容的讲解。 设置AttributeSet 使用GAS之前&#xff0c;首先需要设置参数集AS&#xff0c;这个是用于同步的一些参数&#xff0c;至于如何设置GAS&a…

腾讯云Linux服务器创建、使用和配置的教程

腾讯云Linux服务器创建&#xff0c;先注册腾讯云账号&#xff0c;购买云服务器配置然后选择Linux镜像操作系统&#xff0c;包括云服务器地域、CVM实例、公网IP等配置&#xff0c;然后远程链接到腾讯云服务器快速配置使用教程&#xff1a; 目录 腾讯云Linux服务器创建 创建Li…

远程控制医疗行业应用解析:如何满足医院合规需求?

远程控制医疗行业应用解析&#xff1a;如何满足医院合规需求&#xff1f; 作为一个起源于IT行业的技术&#xff0c;以远程桌面为基础的远程控制技术目前在医疗领域也已经有了比较广阔的应用前景&#xff0c;尤其是在医疗数字化系统/设备的远程运维场景&#xff0c;已经有了一些…

Spring Profile与PropertyPlaceholderConfigurer实现项目多环境配置切换

最近考虑项目在不同环境下配置的切换&#xff0c;使用profile注解搭配PropertyPlaceholderConfigurer实现对配置文件的切换&#xff0c;简单写了个demo记录下实现。 基本知识介绍 Profile Profile通过对bean进行修饰&#xff0c;来限定spring在bean管理时的初始化情况&#…

K8S调度

K8S调度 一、List-Watch 机制 controller-manager、scheduler、kubelet 通过 List-Watch 机制监听 apiserver 发出的事件&#xff0c;apiserver 通过 List-Watch 机制监听 etcd 发出的事件1.scheduler 的调度策略 预选策略/预算策略&#xff1a;通过调度算法过滤掉不满足条件…

CH344Q/L USB转四串口芯片资料下载(合集)

1、产品手册 CH344DS1.PDF - 南京沁恒微电子股份有限公司CH344技术手册&#xff0c;USB转4串口芯片&#xff0c;支持最高6M波特率与硬件流控&#xff0c;支持USB配置功能&#xff0c;提供RS485方向控制与GPIO等信号引脚&#xff0c;可实现PC等平台扩展多串口或多个串口设备升级…

多维时序 | MATLAB实现ZOA-CNN-BiGRU-Attention多变量时间序列预测

多维时序 | MATLAB实现ZOA-CNN-BiGRU-Attention多变量时间序列预测 目录 多维时序 | MATLAB实现ZOA-CNN-BiGRU-Attention多变量时间序列预测预测效果基本介绍模型描述程序设计参考资料 预测效果 基本介绍 1.Matlab基于ZOA-CNN-BiGRU-Attention斑马优化卷积双向门控循环单元网络…

ARTS 挑战打卡的第7天 --- Ubuntu中的WindTerm如何设置成中文,并且关闭shell中Tab键声音(Tips)

前言 &#xff08;1&#xff09;Windterm是一个非常优秀的终端神器。关于他的下载我就不多说了&#xff0c;网上很多。今天我就分享一个国内目前没有找到的这方面的资料——Ubuntu中的WindTerm如何设置成中文&#xff0c;并且关闭shell中Tab键声音。 将WindTerm设置成中文 &…

Markdown的简单语法学习

简单掌握Markdown语法&#xff1a; 1、标题&#xff1a; 如果一段文字被定义为标题&#xff0c;只要在这段文字前面加#即可。 # 一级标题 ## 二级标题 ### 三级标题 2、列表&#xff1a; 列表分有序列表和无序列表&#xff1a; ###### 无序列表 * 1 * 2 * 3- 1 - 2 - 3#####…

echarts饼图例子

效果 代码&#xff1a;index。vue <div class"riskStatisticsBox"><div class"titleBox">风险统计</div><div class"contentBox"><div class"selectGroupBox"><div class"categoryBox">…

Vc - Qt - 绘制窗口背景色

要在Qt中绘制一个背景颜色&#xff0c;你可以使用Qt的绘图功能来完成。下面是一种简单的方法&#xff1a; 步骤1&#xff1a;在你想要绘制背景颜色的QWidget&#xff08;例如QMainWindow或QDialog&#xff09;的派生类中&#xff0c;重写 它的paintEvent函数。步骤2&#xff1a…

模拟信号和数字信号的转换

此文章介绍的模拟信号与数字信号转换相关的知识有如下&#xff1a; 通信原理的PCM脉冲编码调制 数字电子技术的A/D与D/A 以及stm32的ADC与DAC 模拟信号是指-----时间和数值均连续变化的电信号&#xff0c;如正弦波、三角波等。 数字信号是指-----在时间上和数值上均是离散的…