当前位置: 首页 > news >正文

js基础---var与let的区别以及const的使用

js基础—var与let的区别以及const的使用

var与let的区别

在较旧的JavaScript,使用关键字var来声明变量,而不是let。var现在开发中一般不再使用它,只是我们可能再老版程序中看到它。let的出现为了解决var的一些问题。
var 声明存在以下三种问题:

  • 可以先使用在声明 (不合理)
  • var声明过的变量可以重复声明(不合理)
  • 比如变量提升、全局变量、没有块级作用域等等

举例说明

变量提升

  • var的情况
    console.log(a); // 输出undefined
    var a = 10;
    
    解释:var声明的变量会被提升到函数或全局作用域的顶部,但此时变量的值还未被初始化,所以输出undefined
  • let的情况
    console.log(b); // 报错,ReferenceError: b is not defined
    let b = 20;
    
    解释:let声明的变量也会被提升,但不会被初始化,处于暂时性死区,所以访问它会报错。

重复声明

  • var的情况
    var c = 30;
    var c = 40;
    console.log(c); // 输出40
    
    解释:var声明的变量可以重复声明,后面的声明会覆盖前面的声明。
  • let的情况
    let d = 50;
    let d = 60; // 报错,SyntaxError: Identifier 'd' has already been declared
    
    解释:let声明的变量不能重复声明,否则会报错。

作用域

  • var的情况
    if (true) {var e = 70;
    }
    console.log(e); // 输出70
    
    解释:var声明的变量具有函数作用域或全局作用域,没有块级作用域,所以在if块外部也可以访问到e
  • let的情况
    if (true) {let f = 80;
    }
    console.log(f); // 报错,ReferenceError: f is not defined
    
    解释:let声明的变量具有块级作用域,在if块外部无法访问到f

全局变量

  • var的情况
    function g() {var h = 90;
    }
    g();
    console.log(h); // 报错,ReferenceError: h is not defined
    
    var i = 100;
    console.log(window.i); // 输出100
    
    解释:在函数内部使用var声明的变量不会成为全局变量。在全局作用域中使用var声明的变量会成为全局对象(如浏览器中的window)的属性。
  • let的情况
    function j() {let k = 110;
    }
    j();
    console.log(k); // 报错,ReferenceError: k is not defined
    
    let l = 120;
    console.log(window.l); // 输出undefined
    
    解释:let声明的变量不会成为全局对象的属性,无论是函数内部还是全局作用域。

var确实存在一些问题,如变量提升可能导致的逻辑错误、重复声明带来的混淆以及缺乏块级作用域等。在现代JavaScript开发中,推荐使用let来声明变量,以避免这些问题,提高代码的可读性和可维护性。

常量const

概念

使用const声明的变量称为“常量”。常量与变量的主要区别在于,常量一旦被赋值后,其值就不能再被改变。这使得常量在程序中具有稳定性和可预测性,有助于减少因意外修改而导致的错误。

使用场景

当某个变量的值在程序的整个生命周期中都不会改变时,就可以使用const来声明。例如,一些数学常数、配置参数、枚举值等都可以使用const声明。使用const声明常量可以明确地表达出该值不应当被修改的意图,同时也能够让阅读代码的人更容易理解代码的意图。

命名规范

常量的命名规范与变量基本一致,但有一些细微的差别。通常情况下,常量的名称使用大写字母,单词之间用下划线连接,以突出其常量的特性。例如:

const MAX_VALUE = 100;
const PI = 3.14159;

这种命名方式可以让开发者在阅读代码时,能够快速识别出这是一个常量,而不是一个普通变量。

常量使用示例

// 声明一个常量
const G = 9.8;
// 输出这个常量
console.log(G);

注意事项

  1. 不允许重新赋值:常量一旦被赋值后,就不能再被重新赋值。如果尝试对常量重新赋值,将会导致语法错误。例如:

    const G = 9.8;
    G = 9.9; // TypeError: Assignment to constant variable.
    

    这一特性确保了常量的值在程序运行过程中始终保持不变。

  2. 声明时必须赋值(初始化):使用const声明常量时,必须在声明的同时进行初始化赋值。不能先声明常量,然后再赋值。例如:

    const G; // SyntaxError: Missing initializer in const declaration
    G = 9.8;
    

    这是因为const声明的常量必须有一个明确的初始值,以保证其在整个作用域内的值都是确定的。

小技巧

对于不需要重新赋值的数据,使用const是一个很好的选择。这不仅可以避免意外修改数据,还可以提高代码的可读性和可维护性。在实际开发中,养成使用const的习惯,可以让你的代码更加健壮和清晰。

常量与对象属性

需要注意的是,虽然使用const声明的对象本身不能被重新赋值,但对象的属性是可以被修改的。例如:

const obj = { name: 'Kimi', age: 20 };
obj.name = 'Moonshot'; // 合法操作,修改对象属性
console.log(obj); // 输出 { name: 'Moonshot', age: 20 }

这是因为const只是保证了变量指向的对象引用不能改变,而不是对象内部的属性不能改变。如果需要保证对象的属性也不被修改,可以使用Object.freeze()方法来冻结对象,使其成为不可变对象。例如:

const obj = { name: 'Kimi', age: 20 };
Object.freeze(obj);
obj.name = 'Moonshot'; // 不会改变对象属性,因为对象被冻结了
console.log(obj); // 输出 { name: 'Kimi', age: 20 }

通过这种方式,可以确保对象及其属性在整个程序中都不会被修改,从而实现更严格的数据保护。

总之,合理使用const声明常量,可以在很大程度上提高代码的质量和稳定性。在编写JavaScript代码时,建议尽可能多地使用const来声明那些不需要改变的值。

相关文章:

js基础---var与let的区别以及const的使用

js基础—var与let的区别以及const的使用 var与let的区别 在较旧的JavaScript,使用关键字var来声明变量,而不是let。var现在开发中一般不再使用它,只是我们可能再老版程序中看到它。let的出现为了解决var的一些问题。 var 声明存在以下三种问…...

用css和html制作太极图

目录 css相关参数介绍 边距 边框 伪元素选择器 太极图案例实现、 代码 效果 css相关参数介绍 边距 <!DOCTYPE html> <html><head><meta charset"utf-8"><title></title><style>*{margin: 0;padding: 0;}div{width: …...

OJ12:160. 相交链表

目录 题目思路分析代码展示 题目 给你两个单链表的头节点 headA 和 headB &#xff0c;请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点&#xff0c;返回 null 。 示例 1&#xff1a; 输入&#xff1a;intersectVal 8, listA [4,1,8,4,5], listB [5,…...

软件工程和项目管理领域 - CMMI 极简理解

CMMI 概述 CMMI 全称为 Capability Maturity Model Integration&#xff0c;即能力成熟度模型集成 CMMI 是由美国卡内基梅隆大学软件工程研究所&#xff08;SEI&#xff09;开发的一套综合性管理模型 CMMI 是一种用于评估和改进组织在软件开发和维护方面过程能力的国际标准 …...

C# 线程基础之 线程同步

线程同步的手段很多 lock 是通过内存索引块 0 1 切换 进行互斥的实现 互斥量 信号量 事件消息 其实意思就是 一个 标记量 通过这个标记 来进行类似的互斥手段 具体方式的分析 代码在后 1.互斥量 Mutex 作用 非常类似lock 一个Mutex 名称来代替 lock的引用对象 2.信号量 Semaph…...

[c语言日寄]c语言也有“回”字的多种写法——整数交换的三种方式

大家好啊&#xff0c;在今天的快乐刷题中&#xff0c;我们遇到了这样一道题目&#xff1a; 题目 写出 三种不同方式的 交换两个整数变量的 函数 交换变量的三种解法 常规方式 想要交换两个变量很简单&#xff0c;第一种方式就是新建一个临时变量&#xff0c;具体流程如下&…...

RocketMQ 知识速览

文章目录 一、消息队列对比二、RocketMQ 基础1. 消息模型2. 技术架构3. 消息类型4. 消费者类型5. 消费者分组和生产者分组 三、RocketMQ 高级1. 如何解决顺序消费和重复消费2. 如何实现分布式事务3. 如何解决消息堆积问题4. 如何保证高性能读写5. 刷盘机制 &#xff08;topic 模…...

优化 Azure Synapse Dedicated SQL Pool中的 SQL 执行性能的经验方法

在 Azure Synapse Dedicated SQL Pool中优化 SQL 执行涉及了解底层体系结构&#xff08;例如分布和分区&#xff09;、查询优化&#xff08;例如避免不必要的子查询和联接&#xff09;&#xff0c;以及利用具体化视图和 PolyBase 等工具进行高效数据加载。 1.有效使用分布和分…...

详解英语单词“pro bono”:公益服务的表达(中英双语)

中文版 详解英语单词“pro bono”&#xff1a;公益服务的表达 一、词义解释 “Pro bono” 是一个源自拉丁语的短语&#xff0c;完整表达为 “pro bono publico”&#xff0c;意思是“为了公众利益”&#xff08;for the public good&#xff09;。在现代英语中&#xff0c;它…...

16. C语言 字符串详解

本章目录: 前言C 字符串的基础概念字符串的定义字符串的内存表示 常见的字符串操作函数示例代码 深入探讨字符串长度计算strlen 与 sizeof 的区别 字符串操作的注意事项**1. 字符数组的大小**2. 字符数组和字符指针的区别3. 使用安全函数 字符串的遍历与格式化输出**遍历字符串…...

使用Buildroot开始嵌入式Linux系统之旅-3

文章目录 at91bootstrap操作教程修改at91bootstrap具体配置重新编译at91bootstrap U-Boot操作教程修改U-Boot具体配置重新编译U-Boot Linux Kernel操作教程修改Linux Kernel具体配置重新编译Linux Kernel buildroot操作进阶生成图形化软件模块依赖关系查看具体软件模块依赖关系…...

[免费]SpringBoot+Vue新能源汽车充电桩管理系统【论文+源码+SQL脚本】

大家好&#xff0c;我是java1234_小锋老师&#xff0c;看到一个不错的SpringBootVue新能源汽车充电桩管理系统&#xff0c;分享下哈。 项目视频演示 【免费】SpringBootVue新能源汽车充电桩管理系统 Java毕业设计_哔哩哔哩_bilibili 项目介绍 随着信息化时代的到来&#xff0…...

【已解决】【记录】2AI大模型web UI使用tips 本地

docker desktop使用 互动 如果需要发送网页链接&#xff0c;就在链接上加上【#】号 如果要上传文件就点击这个➕号 中文回复 命令它只用中文回复&#xff0c;在右上角打开【对话高级设置】 输入提示词&#xff08;提示词使用英文会更好&#xff09; Must reply to the us…...

44.ComboBox的数据绑定 C#例子 WPF例子

固定最简步骤&#xff0c;包括 XAML&#xff1a; 题头里引入命名空间 标题下面引入类 combobox绑定资源属性和选择属性&#xff0c;block则绑定和combobox一样的选择属性 C#&#xff1a; 通知的类&#xff0c;及对应固定的任务 引入字段 引入属性 其中资源是只读的 选…...

物联网之传感器技术

引言 在数字化浪潮席卷全球的今天&#xff0c;物联网&#xff08;IoT&#xff09;已成为推动各行各业变革的重要力量。而物联网传感器&#xff0c;作为物联网感知层的核心技术&#xff0c;更是扮演着不可或缺的角色。它们如同人类的五官&#xff0c;能够感知物理世界中的各种信…...

QTreeWidget QTreeWidgetItem

QTreeWidgetItem 是 Qt 框架中用于在 QTreeWidget 中表示树形结构中每个节点的类。它是 QTreeWidget 的一部分&#xff0c;允许您创建和管理层次结构的数据展示。 QTreeWidgetItem 用于表示树形结构中的单个节点。 添加子节点&#xff1a; 可以通过 addChild() 方法向节点添加…...

torch.einsum计算张量的外积

torch.einsum 是一种强大的张量操作工具,可以通过爱因斯坦求和约定(Einstein summation convention)来简洁地表示复杂的张量运算。通过它,我们可以高效地计算矩阵乘法、转置、点积、外积等操作。 以下是关于如何使用 torch.einsum 计算两个四维张量在第三维度上的外积的解…...

PostgreSQL 超级管理员详解

1. 什么是 PostgreSQL 超级管理员 PostgreSQL 超级管理员&#xff08;superuser&#xff09;是拥有数据库系统最高权限的用户。他们可以执行任何数据库操作&#xff0c;包括但不限于创建和删除数据库、用户、表空间、模式等。超级管理员权限是 PostgreSQL 中权限的最高级别。 …...

RabbitMQ 工作模式使用案例之(发布订阅模式、路由模式、通配符模式)

Hi~&#xff01;这里是奋斗的明志&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f331;&#x1f331;个人主页&#xff1a;奋斗的明志 &#x1f331;&#x1f331;所属专栏&#xff1a;RabbitMQ &#x1f4da;本系列文章为个人学…...

【2024年华为OD机试】(C卷,100分)- 机场航班调度程序 (Java JS PythonC/C++)

一、问题描述 题目描述 XX市机场停放了多架飞机&#xff0c;每架飞机都有自己的航班号&#xff0c;如CA3385&#xff0c;CZ6678&#xff0c;SC6508等&#xff0c;航班号的前2个大写字母&#xff08;或数字&#xff09;代表航空公司的缩写&#xff0c;后面4个数字代表航班信息…...

L293D电机驱动库:嵌入式直流电机控制实战指南

1. L293D电机驱动库深度解析&#xff1a;面向嵌入式工程师的工程实践指南L293D是TI&#xff08;德州仪器&#xff09;推出的双H桥直流电机驱动芯片&#xff0c;广泛应用于Arduino、ESP32等微控制器平台的中小功率直流电机控制场景。本库并非简单封装GPIO操作&#xff0c;而是针…...

SQLite NULL 值

SQLite NULL 值 SQLite 是一种轻量级的数据库管理系统,广泛用于嵌入式系统和移动应用中。在 SQLite 中,NULL 值是一个非常重要的概念,它表示未知、缺失或不确定的数据。本文将详细介绍 SQLite 中的 NULL 值,包括其定义、处理方法以及优化技巧。 什么是 NULL 值 在 SQLit…...

ViGEmBus终极指南:3分钟掌握Windows虚拟游戏手柄驱动

ViGEmBus终极指南&#xff1a;3分钟掌握Windows虚拟游戏手柄驱动 【免费下载链接】ViGEmBus Windows kernel-mode driver emulating well-known USB game controllers. 项目地址: https://gitcode.com/gh_mirrors/vi/ViGEmBus ViGEmBus是一款强大的Windows内核级驱动程序…...

ChilloutMix NiPrunedFp32Fix 模型完整教程:从零开始掌握AI图像生成

ChilloutMix NiPrunedFp32Fix 模型完整教程&#xff1a;从零开始掌握AI图像生成 【免费下载链接】chilloutmix_NiPrunedFp32Fix 项目地址: https://ai.gitcode.com/hf_mirrors/emilianJR/chilloutmix_NiPrunedFp32Fix ChilloutMix NiPrunedFp32Fix 是一款基于稳定扩散技…...

基于MATLAB平台PCA的人脸识别:开启识别新征程

基于MATLAB平台PCA的人脸识别&#xff0c;程序已调通&#xff0c;可将自己的数据替换进行识别。 得到识别准确率结果。最近在研究人脸识别技术&#xff0c;基于MATLAB平台利用PCA&#xff08;主成分分析&#xff09;实现了一个人脸识别程序&#xff0c;现在跟大家分享分享。 PC…...

GRS认证实操干货:TC交易证书全流程解析(源头供应商必看)

一、前言&#xff1a;GRS证书与TC的核心关联&#xff08;新手必懂&#xff09;在再生行业GRS认证体系中&#xff0c;多数源头供应商存在一个核心认知误区&#xff1a;认为拿到GRS范围证书&#xff08;SC&#xff09;就完成了合规闭环&#xff0c;实则不然。GRS证书&#xff08;…...

3大云平台统一监控:Telegraf多厂商集成实战指南

3大云平台统一监控&#xff1a;Telegraf多厂商集成实战指南 在当今多云架构盛行的时代&#xff0c;企业往往同时使用AWS、Azure和Google Cloud等多个云平台&#xff0c;这使得跨平台的监控变得复杂而棘手。Telegraf作为一款插件驱动的服务器代理&#xff0c;专为收集和报告指标…...

ollama部署本地大模型|embeddinggemma-300m跨境电商评论情感迁移学习实践

ollama部署本地大模型&#xff5c;embeddinggemma-300m跨境电商评论情感迁移学习实践 1. 环境准备与快速部署 想要在本地运行强大的文本嵌入模型吗&#xff1f;今天我来手把手教你用ollama部署embeddinggemma-300m&#xff0c;这是一个只有3亿参数但效果惊人的小模型&#xf…...

BES-XGBoost多变量时间序列预测的‘秃鹰搜索优化算法‘与交叉验证抑制过拟合问题的Mat...

基于秃鹰搜索优化算法优化XGBoost(BES-XGBoost)的多变量时间序列预测 BES-XGBoost多变量时间序列 采用交叉验证抑制过拟合问题 优化参数为迭代次数、最大深度和学习率 matlab代码&#xff0c;注&#xff1a;暂无Matlab版本要求 -- 推荐 2016B 版本及以上 注&#xff1a;采用 XG…...

DCT-Net效果实测:保留真人特征的同时,完美融入卡通美学

DCT-Net效果实测&#xff1a;保留真人特征的同时&#xff0c;完美融入卡通美学 1. 引言&#xff1a;当真实照片遇见卡通魔法 想象一下&#xff0c;你随手拍的一张普通自拍&#xff0c;在几秒钟内就能变成专业插画师级别的卡通头像。这不是科幻电影里的场景&#xff0c;而是DC…...