JavaScript 中 let 和 var 的区别

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.mzph.cn/news/32025.shtml

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

相关文章

【C++】static_cast基本用法(详细讲解)

👉博__主👈:米码收割机 👉技__能👈:C/Python语言 👉公众号👈:测试开发自动化【获取源码商业合作】 👉荣__誉👈:阿里云博客专家博主、5…

面试热题(字符串相加)

给定两个字符串形式的非负整数 num1 和num2 ,计算它们的和并同样以字符串形式返回。 你不能使用任何內建的用于处理大整数的库(比如 BigInteger), 也不能直接将输入的字符串转换为整数形式。 输入:num1 "11"…

2023-08-11力扣每日一题

链接&#xff1a; 1572. 矩阵对角线元素的和 题意&#xff1a; 计算主对角线和副对角线上的元素的和&#xff08;不计算重复的&#xff09; 解&#xff1a; O.o&#xff1f; 实际代码&#xff1a; #include<bits/stdc.h> using namespace std; int diagonalSum(ve…

Debian 12.1 正式发布

导读Debian 12.1 现已发布&#xff0c;这是对稳定发行版 Debian 12&#xff08;代号 Bookworm &#xff09;的首次更新。本次发布主要增加了安全问题的修正&#xff0c;并对严重问题进行了一些调整。 一些更新内容包括&#xff1a; 妥善处理系统用户的创建&#xff1b;修复 eq…

Jmeter请求接口返回值乱码解决

乱码示例 解决步骤&#xff1a; 1.打开Jmeter安装目录下的bin目录&#xff0c;找到jmeter.properties 2.使用记事本或其他编译工具打开jmeter.properties文件&#xff0c;然后全局搜索sampleresult.default.encoding 3.在文件中添加sampleresult.default.encodingutf-8,保存…

前端技术Html,Css,JavaScript,Vue3

Html 1.基本标签 <h1>最大的标题</h1> <h2> . . . </h2> <h3> . . . </h3> <h4> . . . </h4> <h5> . . . </h5> <h6>最小的标题</h6><p>这是一个段落。</p> <br> &#xff08;换…

mac安装nvm管理工具遇到的问题和解决方法

nvm 是一款可以管理多版本node的工具&#xff0c;因为是刚买没多久的电脑之前用的都是windows&#xff0c;昨天折腾了一下午终于倒腾好了 第一步&#xff1a; 卸载电脑已有的node&#xff1b;访问nvm脚本网址&#xff0c;另存为到电脑上任何目录&#xff0c;我是放在桌面上的…

使用eXosip+ffmpeg、ffplay命令行实现sip客户端

文章目录 前言一、关键实现1、主要流程2、解决端口冲突&#xff08;1&#xff09;、出现原因&#xff08;2&#xff09;、解决方法 3、解析sdp&#xff08;1&#xff09;、定义实体&#xff08;2&#xff09;、解析视频&#xff08;3&#xff09;、解析音频 4、命令行推拉流&am…

threejs点击模型实现模型边缘高亮的选中效果--更改后提高帧率

先来个效果图 之前写的那个稍微有点问题&#xff0c;帧率只有30&#xff0c;参照官方代码修改后&#xff0c;帧率可以达到50了&#xff0c;在不全屏的状态下&#xff0c;帧率60 1.首先需要导入库 // 用于模型边缘高亮 import { EffectComposer } from "three/examples/js…

github 无语的问题,Host does not existfatal: Could not read from remote repository.

Unable to open connection: Host does not existfatal: Could not read from remote repository. image.png image.png image.png Please make sure you have the correct access rights and the repository exists. 如果github desktop和git pull 和git clone全部都出问题了&…

[保研/考研机试] KY102 计算表达式 上海交通大学复试上机题 C++实现

描述 对于一个不存在括号的表达式进行计算 输入描述&#xff1a; 存在多组数据&#xff0c;每组数据一行&#xff0c;表达式不存在空格 输出描述&#xff1a; 输出结果 示例1 输入&#xff1a; 6/233*4输出&#xff1a; 18思路&#xff1a; ①设立运算符和运算数两个…

视觉学习(七)---Flask 框架下接口调用及python requests 实现json字符串传输

在项目实施过程中需要与其他系统进行接口联调&#xff0c;将图像检测的结果传递给其他系统接口&#xff0c;进行逻辑调用。这中间的过程可以通过requests库进行实现。 1.安装requests库 pip install requests2.postman 接口测试 我们先通过postman 了解下接口调用&#xff0…

在vue3+vite项目中使用jsx语法

如果我掏出下图&#xff0c;阁下除了私信我加入学习群&#xff0c;还能如何应对&#xff1f; 正文开始 前言一、下载资源二、利用vite工具引入babel插件总结 前言 最近在为部署人员开发辅助部署的工具&#xff0c;技术栈是vue3viteelectron&#xff0c;在使用jsx语法时&#x…

08-2_Qt 5.9 C++开发指南_坐标系统和坐标变换

文章目录 1. 坐标变换函数2. 视口和窗口 1. 坐标变换函数 QPainter 在窗口上绘图的默认坐标系统如下图所示&#xff0c;这是绘图设备的物理坐标。 为了绘图的方便&#xff0c;QPainter 提供了一些坐标变换的功能&#xff0c;通过平移、旋转等坐标变换&#xff0c;得到一个逻辑…

linux Ubuntu 更新镜像源、安装sudo、nvtop、tmux

1.更换镜像源 vi ~/.pip/pip.conf在打开的文件中输入: pip.conf [global] index-url https://pypi.tuna.tsinghua.edu.cn/simple按下:wq保存并退出。 2.安装nvtop 如果输入指令apt install nvtop报错&#xff1a; E: Unable to locate package nvtop 需要更新一下apt&a…

gitlab 503 错误的解决方案

首先使用 sudo gitlab-ctl status 命令查看哪些服务没用启动 sudo gitlab-ctl status 再用 gitlab-rake gitlab:check 命令检查 gitlab。根据发生的错误一步一步纠正。 gitlab-rake gitlab:check 查看日志 tail /var/log/gitlab/gitaly/current删除gitaly.pid rm /var/opt…

SpringBoot 的自动装配特性

1. Spring Boot 的自动装配特性 Spring Boot 的自动装配&#xff08;Auto-Configuration&#xff09;是一种特性&#xff0c;它允许您在应用程序中使用默认配置来自动配置 Spring Framework 的各种功能和组件&#xff0c;从而减少了繁琐的配置工作。通过自动装配&#xff0c;您…

React Native数据存储

最近做RN开发中需要数据存储&#xff0c;查阅RN官方资料&#xff0c;发现推荐我们使用 AsyncStorage,对使用步骤做一下记录。 AsyncStorage是什么 简单的&#xff0c;异步的&#xff0c;持久化的key-value存储系统AsyncStorage在IOS下存储分为两种情况&#xff1a; 存储内容较…

MongoDB【无敌详细,建议收藏】

"探索MongoDB的无边之境&#xff1a;沉浸式数据库之旅" 欢迎来到MongoDB的精彩世界&#xff01;在这个博客中&#xff0c;我们将带您进入一个充满创新和无限潜力的数据库领域。无论您是开发者、数据工程师还是技术爱好者&#xff0c;MongoDB都将为您带来一场令人心动…

【java实习评审】对推电影详情模块的基本电影模型设计到位,并能考虑到特色业务的设计

大家好&#xff0c;本篇文章分享一下【校招VIP】免费商业项目"推电影"第一期 电影详情模块 Java同学的开发文档周最佳作品。该同学来自暨南大学电子信息专业。 本项目的商业出发点&#xff1a; 豆瓣评分越来越水&#xff0c;不太符合年青人的需求&#xff0c;我们推…