news 2026/9/30 14:37:17

typescript-var和let作用域

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
typescript-var和let作用域

什么是作用域?

作用域可以理解为某个变量在某个范围内是可以访问到。

var是函数作用域(声明的函数内)、全局作用域(在哪里都可以访问到)

let是块级作用域(即程序中的大括号{}包含的范围内)

看下面的例子:

console.log("---------------------"); { var c = 100; } console.log(c); { let c = 10; console.log("block area ", c); } console.log(c); console.log("======================");

看以上示例中输出的两个100都是输出的var声明的变量c,因为var声明的是函数作用域或全局作用域(在这里是全局的),所以输出发的时候是100;

而let声明的是块级作用域,即只在大括号内有效{},所以只有在大括号内输出的才是10,即使大括号外有输出这个变量,也不能输出这个块里面的值。

再看下面的例子:

function test() { for (var i = 0; i < 10; i++) { setTimeout(() => { console.log(i); }, 0); } } test(); function test1() { for (var i = 0; i < 10; i++) { (function (index) { setTimeout(function () { console.log(index); }, 0); })(i); } } test1(); function test2() { for (let i = 0; i < 10; i++) { setTimeout(() => { console.log(i); }, 0); } } test2();

这个有点绕,

test函数中使用的是var,是函数作用域,而setTimeout是异步函数,for的循环执行完了(这里是同步执行的),最后i变成了10,而setTimeout会在同步函数后执行,所以最后输出了函数作用域内的变量i,即10.

test1函数中也是使用的var,但是输出正常,这里有一个区别是使用了立即执行函数,即内部有一个function,这里把var的参数传给了index,而index是在这个内部函数作用域内有效,这个在书面上理解为捕获了i的值。即把i的值给了index,index是函数作用域内的,异步setTimeout执行的时候 ,输出了内部函数中的index的值。(这个是我个人的理解啊,有误差的大家可以指正)

test2函数中使用的是let,这个是块级作用域,即{}捕获了i的值。可以避免var声明引起的问题。在未来的工作中要尽量使用let。避免出现上面说的问题。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/9/29 10:22:27

如何快速生成说明书二维码和音频二维码?

在现代使用中&#xff0c;二维码成为共享信息的重要工具。通过二维码&#xff0c;用户可以快速访问电子说明书和音频内容&#xff0c;提高了获取信息的效率。生成二维码的过程简单&#xff0c;只需要几步。不论是将说明书转化为二维码还是处理音频文件&#xff0c;首先需选定一…

作者头像 李华
网站建设 2026/9/29 10:22:26

通达信主力上班指标公式

{}volUME:VOL,VOLSTICK; MAVOL1:MA(VOLUME,5); MAVOL2:MA(VOLUME,60); CC:(3*COLH)/6; MM:EMA(EMA(CC,20),2); 主力操盘基准量:HHV(MM,5)MAVOL2,COLORYELLOW,LINETHICK1; ZTJ:ZTPRICE(REF(CLOSE,1),0.1); DTJ:DTPRICE(REF(CLOSE,1),0.1); {k线} 阳线:C>O; 上影线:(H-MAX(C,O…

作者头像 李华
网站建设 2026/9/30 13:08:17

基于SpringBoot的车辆报废回收系统(源码+lw+部署文档+讲解等)

课题介绍本课题聚焦车辆报废回收流程规范化与资源高效循环利用的核心需求&#xff0c;设计并实现基于SpringBoot框架的车辆报废回收系统。当前车辆报废回收领域存在流程繁琐不透明、车辆信息追溯困难、回收企业与车主对接低效、报废资源处置监管不足等问题&#xff0c;制约了报…

作者头像 李华
网站建设 2026/9/30 3:59:13

基于SpringBoot的宠物医院管理系统(源码+lw+部署文档+讲解等)

课题介绍本课题聚焦宠物医院诊疗服务规范化管理与运营效率提升的核心需求&#xff0c;设计并实现基于SpringBoot框架的宠物医院管理系统。当前宠物医院运营领域普遍存在宠物病例记录零散、诊疗流程衔接不畅、药品库存管控混乱、客户档案管理滞后、收费结算效率低下等问题&#…

作者头像 李华
网站建设 2026/9/25 19:46:52

别再装一堆客户端了!

Mac用户的文件传输"终极方案"探索&#xff1a;这款工具深度测评与效率工作流搭建在苹果电脑系统生态中&#xff0c;如何选择一款功能全面、使用高效且界面简洁的文件传输管理软件&#xff0c;一直是许多开发人员、设计人员和技术运维工作者关注的课题。今天&#xff…

作者头像 李华