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

【ES】笔记-let 声明及其特性

news 2026/3/30 21:14:08

let 声明及其特性

  1. 声明变量
    • 变量赋值、也可以批量赋值
        let a;let b,c,d;let e=100;let f=521,g='iloveyou',h=[];
  1. 变量不能重复声明
         let star='罗志祥';let star='小猪';

在这里插入图片描述

  1. 块级作用域，let声明的变量只在块级作用域内有效
        {let girl='周杨青';}console.log(girl)

注意：在 if else while for 中使用let都是块级作用域
在这里插入图片描述

  1. 不存在变量提升

使用var(存在变量提升)

	console.log(girl);var  girl = "小刘同学"// 打印结果:undefined

使用let(不存在变量提升)

 	console.log(girl);let  girl = "小刘同学"// 报错:ncaught ReferenceError: Cannot access 'girl'

注：变量提升就是在变量创建之前使用（比如输出：输出的是默认值），let不存在，var存在

  1. 不影响作用域链
        {let school='德仔同学';function fn(){console.log(school);}fn();// 打印结果:小刘同学}

注：作用域链是代码块内有代码块，跟常规编程语言一样，上级代码块中的局部变量下级可用

  1. let使用案例：
    html代码
   <style>.item {width: 100px;height: 50px;border: solid 1px rgb(42, 156, 156);float: left;margin-right: 10px;}</style><body><div class="container"><h2 class="page-header">let案例：点击div更改颜色</h2><div class="item"></div><div class="item"></div><div class="item"></div></div></body>

JavaScript代码

// 获取class名为item的元素
let items = document.querySelectorAll(".item")// 遍历绑定元素
for(let i=0;i<items.length;i++){items[i].onclick = function(){// 修改当前元素的背景颜色// 写法一// this.style.background = 'pink'// 写法二:items[i].style.background = "pink"}
}

写法二注意事件
在for循环是使用的 i 必须要使用let声明
如果使用var就会报错(原因：var是全局变量)
经过循环之后i的值会变成3,items[i]就会下表越界
let是局部变量
我们要知道点击的时候 i 是那个值

   //使用var相当于是:{ var i = 0; }{ var i = 1; }{ var i = 2; }{ var i = 3; }// 下面的声明会将上面的覆盖掉，所以点击事件每次找到的都是3// 而使用let使用var相当于是:{ let i = 0; }{ let i = 1; }{ let i = 2; }{ let i = 3; }// 由于let声明的是局部变量，每一个保持着原来的值// 点击事件调用的时候拿到的是对应的 i

总结:let声明的变量更加规范合理，尽量使用let来声明和使用变量

相关文章：

【ES】笔记-let 声明及其特性

let 声明及其特性 声明变量 变量赋值、也可以批量赋值 let a;let b,c,d;let e100;let f521,giloveyou,h[];变量不能重复声明 let star罗志祥;let star小猪;块级作用域&#xff0c;let声明的变量只在块级作用域内有效 {let girl周杨青;}console.log(girl)注意&#xff1a;在 i…...

编程日记 2023/8/3 19:45:26

wps 预加载项插件本地开发启动项目打开wps 客户端，未看到加载项菜单，

wps 预加载项插件本地开发启动项目打开wps 客户端&#xff0c;未看到加载项菜单&#xff0c;请检查本地c盘安装目录下“jsplugins.xml”信息是否添加成功 如下图 name 插件项目 url 本地插件运行地址及端口 <jsplugins><jspluginonline name"wps-soft-copyright…...

编程日记 2023/8/3 19:44:25

uni-app开发微信小程序经常遇到的一些问题及解决方案

1.如何获取用户信息&#xff1f; 可以使用uni.getUserInfo接口获取用户信息。需要用户授权。 2.如何实现下拉刷新&#xff1f; 可以使用uni-app提供的页面组件内置下拉刷新功能&#xff0c;也可以自定义下拉刷新组件。 3.如何实现上拉加载更多&#xff1f; 可以在页面onReachBo…...

编程日记 2023/8/3 19:43:23

一个 git 仓库下拥有多个项目的 git hooks 配置方案

前言 通常情况下&#xff0c;一个 git 仓库就是一个项目&#xff0c;只需要配置一套 git hooks 脚本就可以执行各种校验任务。对于 monorepo 项目也是如此&#xff0c;monorepo 项目下的多个 packages 之间&#xff0c;它们是有关联的&#xff0c;可以互相引用&#xff0c;所以…...

编程日记 2023/8/3 19:42:22

钉钉对接打通金蝶云星空获取流程实例列表详情（宜搭）接口与其他应收单接口

钉钉对接打通金蝶云星空获取流程实例列表详情&#xff08;宜搭&#xff09;接口与其他应收单接口 对接系统钉钉 钉钉&#xff08;DingTalk&#xff09;是阿里巴巴集团专为中国企业打造的免费沟通和协同的多端平台&#xff0c;提供PC版&#xff0c;Web版和手机版&#xff0c;有考…...

编程日记 2023/8/3 19:41:20

用python做一个小项目,python做简单小项目

大家好&#xff0c;本文将围绕用python做一个小项目展开说明&#xff0c;python做简单小项目是一个很多人都想弄明白的事情&#xff0c;想搞清楚python入门小项目需要先了解以下几个事情。 来源丨网络 经常听到有朋友说&#xff0c;学习编程是一件非常枯燥无味的事情。其实&…...

编程日记 2023/8/3 19:40:20

输入筛选框搜索

文章目录 输入筛选框实现效果图需求前端工具版本添加依赖main.js导入依赖 代码 后端代码对应 sql对应 mapper.xml 文件的动态 sql 输入筛选框实现 效果图 需求 通过筛选框&#xff0c;选择公司&#xff0c;传入后端&#xff0c;后端根据公司名称去文章的内容中进行模糊查询 …...

编程日记 2023/8/3 19:39:18

公司植物日常护养方法备忘录

植物为我们净化空气&#xff0c;美化环境&#xff0c;我们要按照科学的经验照顾好它们。公司植物日常通用护养方法如下&#xff1a; 首先剪掉已经枯黄的部分。 需要晒太阳的植物按时搬到外面晒太阳&#xff0c;每次晒1到2个小时。 所有植物统一在每个月的20号左右施肥一次&am…...

编程日记 2023/8/3 19:38:17

小红书JAVA后端一面汇总总结

小红书 2 年社招 Java 后端一面的面经，面试的风格是从一个知识一层一层深入问到底层。 从 Java IO，问到 socket 底层。从 Java 内存，问到操作系统内存。所以学习知识的时候，不要只 看八股文，还是需要从点到面一层层去掌握， 才能比较好应对这类的面试场景。 问题记录 自我…...

编程日记 2023/8/3 19:37:16

【图论】强连通分量进阶

一.作用 强连通分量可以判断环和进行缩点。还有一系列作用.... 这篇文章介绍缩点 二.题目 https://www.luogu.com.cn/problem/P2341 三.思路 我们分析可以知道当一个点没有出度时&#xff0c;则为最受欢迎的牛。但如果有多个出度&#xff0c;则没有最受欢迎的牛。 这是只有…...

编程日记 2023/8/3 19:36:12

perl GetOptions

在Perl中&#xff0c;你可以使用标准模块Getopt::Long来解析命令行选项&#xff08;Command Line Options&#xff09;。Getopt::Long模块允许你定义命令行选项以及它们的值&#xff0c;并且还可以处理各种类型的选项&#xff0c;如标志选项&#xff08;flag options&#xff0…...

编程日记 2023/8/3 19:34:10

QGIS下载谷歌地图或者其他地图

QGIS安装Welcome to the QGIS project! 打开QGIS 添加图源 Google_Maps: https://mt1.google.com/vt/lyrsr&x{x}&y{y}&z{z} Google_Terrain: https://mt1.google.com/vt/lyrst&x{x}&y{y}&z{z} Google_Roads:https://mt1.google.com/vt/lyrsh&x{x…...

编程日记 2023/8/3 19:33:09

Python-re模块-正则表达式模块常用方法

re模块介绍&#xff1a; Python的re模块提供了正则表达式的功能,可以用来进行高级的字符串匹配和处理。re模块的主要功能包括: 编译正则表达式 - 使用re.compile()可以编译正则表达式字符串,生成正则表达式对象。 匹配字符串 - 使用正则表达式对象的match()、search()、finda…...

编程日记 2023/8/3 19:32:08

修改el-select或者el-input样式失效

下午改el-input和el-select这两个的样式真的烦&#xff0c;&#xff0c;&#xff0c;还不如写原生标签了。。 样式使用的是sass 我已经在样式器中挨着挨着去找了&#xff0c;把层级的类都写下来了 .select-wraper{//下拉框.el-select{.el-input .el-input__wrapper{backgrou…...

编程日记 2023/8/3 19:31:06

【Apifox】Apifox设置参数说明：

文章目录 一、效果&#xff1a;二、Query参数&#xff1a;三、返回响应&#xff1a; 一、效果&#xff1a; 二、Query参数&#xff1a; 三、返回响应&#xff1a;...

编程日记 2023/8/3 19:30:06

离线数仓中，为什么用两个flume，一个kafka

实时数仓中&#xff0c;为什么没有零点漂移问题&#xff1f; 因为flink直接取的事件时间用kafka是为了速度快&#xff0c;并且数据不丢&#xff0c;那为什么既用了kafkachannel&#xff0c;也用了kafka&#xff0c;而不只用kafkachannel呢&#xff1f; 因为需要削峰填谷离线数仓…...

编程日记 2023/8/3 19:29:04

p7付费课程笔记6：CMS GC

目录 前言 工作步骤 缺点 问题 前言 上一章节我们讲了串/并行GC&#xff0c;这一章节说下CMS GC。看前思考一个问题&#xff0c;并行GC与CMS GC的区别在哪里。 什么是CMS收集器 CMS(Concurrent Mark-Sweep)是以牺牲吞吐量为代价来获得最短回收停顿时间的垃圾回收器。对于…...

编程日记 2023/8/3 19:27:59

Linux性能分析--cpuinfo的内核实现

目录 一、引言 二、Linux性能分析工具介绍 ------>2.1、proc ------------>2.1.1、内核中的proc文件系统 ------------>2.2.2、proc的实现 ------>2.2、cpuinfo ------------>2.2.1、cpuinfo的内核实现 ------------>2.2.2、寄存器获取cpuinfo数据 …...

编程日记 2023/8/3 19:26:58

鲁大师7月新机性能/流畅/久用榜：骁龙8 Gen2领先版亮相，性能跑分再破新高

摘要&#xff1a;iQOO 11S突破上限&#xff0c;红魔8S Pro再创新高 继五月六月&#xff0c;搭载天玑9200的机型相继迎来上市之后&#xff0c;高通也终于按耐不住。 本月所有上市的新机均搭载高通骁龙系列芯片&#xff0c;其中骁龙8 Gen2领先版迎来首次亮相&#xff0c;除了主打…...

编程日记 2023/8/3 19:25:57

【QT学习】01：helloqt

helloqt OVERVIEW helloqt一、helloqt1.使用向导创建2.手动创建3.pro文件4.Qt应用程序框架 二、按钮创建main.cppmywidget.cpp 三、对象模型1.对象树引入2.存在的问题 一、helloqt 创建一个qt项目&#xff0c;可以使用creator的向导创建&#xff0c;也可自己手动创建&#xff…...

编程日记 2023/8/3 19:24:56

告别手动配置：用STM32CubeMX和Arduino库玩转ADS1115与STM32 ADC

告别手动配置&#xff1a;用STM32CubeMX和Arduino库玩转ADS1115与STM32 ADC 在嵌入式开发的世界里&#xff0c;ADC&#xff08;模数转换器&#xff09;就像一位不知疲倦的翻译官&#xff0c;将模拟世界的连续信号转换为数字世界能理解的离散数值。然而&#xff0c;传统的寄存器…...

编程新知 2026/3/30 20:22:28

情感漏洞经纪：倒卖AI崩溃瞬间年入百万

新兴暴利职业的崛起在人工智能技术高速发展的今天&#xff0c;一种名为“情感漏洞经纪”的灰色产业悄然兴起&#xff0c;从业者通过倒卖AI系统崩溃瞬间的数据年入百万。这些经纪人专门捕捉AI模型在情感交互中的故障时刻——如系统宕机前的“遗言”、未完成的情感回应或异常输出…...

编程新知 2026/3/30 17:58:28

QT多线程定时任务实战：QTimer与QThread的高效协作与主线程通信

1. QT多线程定时任务的核心挑战 在开发桌面应用程序时&#xff0c;经常会遇到需要定期执行某些任务的场景&#xff0c;比如每隔5秒采集一次传感器数据、每分钟检查一次系统状态等。这时候很多开发者会直接在主线程中使用QTimer&#xff0c;但这样做有个致命问题&#xff1a;如…...

编程新知 2026/3/30 17:38:09

使用 C++ 模拟 ShaderLanguage 的 swizzle

经常编写着色器的同学应该对 swizzle&#xff08;重排&#xff09;语法非常熟悉&#xff0c;方便又灵活&#xff0c;可以说是用过一次便回味无穷。 代码 vec4 color vec4(1.0, 0.5, 0.0, 1.0); vec3 rgb color.rgb; // { 1.0, 0.5, 0.0 } vec2 xy color.xy; …...

编程新知 2026/3/30 17:30:06

深入解析振动传感器：从原理到应用的全面指南

1. 振动传感器入门&#xff1a;从"感觉"到"测量"的跨越 你有没有想过&#xff0c;为什么手机横屏时画面会自动旋转&#xff1f;为什么智能手环能记录你的步数&#xff1f;这些看似简单的功能背后&#xff0c;都离不开一个关键元件——振动传感器。作为工业…...

编程新知 2026/3/30 17:15:59

Opyrator UI设计技巧：5个Streamlit自动生成界面教程

Opyrator UI设计技巧&#xff1a;5个Streamlit自动生成界面教程 【免费下载链接】opyrator &#x1fa84; Turns your machine learning code into microservices with web API, interactive GUI, and more. 项目地址: https://gitcode.com/gh_mirrors/op/opyrator Opyr…...

编程新知 2026/3/30 16:41:24

WhisperX语音识别：如何实现70倍实时转录精度与词级时间戳？

WhisperX语音识别&#xff1a;如何实现70倍实时转录精度与词级时间戳&#xff1f; 【免费下载链接】whisperX m-bain/whisperX: 是一个用于实现语音识别和语音合成的 JavaScript 库。适合在需要进行语音识别和语音合成的网页中使用。特点是提供了一种简单、易用的 API&#xff…...

编程新知 2026/3/30 15:58:58

终极指南：VSCode Rainbow Fart如何通过Vue.js打造沉浸式编程体验

终极指南&#xff1a;VSCode Rainbow Fart如何通过Vue.js打造沉浸式编程体验 【免费下载链接】vscode-rainbow-fart 一个在你编程时疯狂称赞你的 VSCode 扩展插件 | An VSCode extension that keeps giving you compliment while you are coding, it will checks the keywords …...

编程新知 2026/3/30 15:32:47

LSPosed-Irena框架深度解析：构建下一代Android Hook框架的完整指南

LSPosed-Irena框架深度解析&#xff1a;构建下一代Android Hook框架的完整指南 【免费下载链接】LSPosed-Irena Useless LSPosed Framework Fork 项目地址: https://gitcode.com/gh_mirrors/ls/LSPosed-Irena LSPosed-Irena是一个基于LSPlant的ART hooking框架&#xff…...

编程新知 2026/3/30 14:32:16

开源字体破局者：思源宋体TTF的免费商用解决方案

开源字体破局者&#xff1a;思源宋体TTF的免费商用解决方案 【免费下载链接】source-han-serif-ttf Source Han Serif TTF 项目地址: https://gitcode.com/gh_mirrors/so/source-han-serif-ttf 在数字设计领域&#xff0c;寻找兼具专业品质与商业授权的中文字体一直是设…...

编程新知 2026/3/30 14:03:26