Typescript let和var区别

TypeScript let vs var

TS本质复用JS的变量规则,核心差异:作用域、变量提升、重复声明、暂时性死区

1.作用域

  • var函数作用域 ,没有块级作用域({}、for、if 不隔离)

  • let块级作用域{}内部声明,外面访问报错

    if(true){
    var a = 1
    let b = 2
    }
    console.log(a) // 1,var逃出if块
    console.log(b) // ❌报错,let块内有效

for循环经典坑

复制代码
for(var i=0;i<3;i++){}
console.log(i) //3,var泄露到循环外面

for(let j=0;j<3;j++){}
console.log(j) //❌报错

2.变量提升

  • var:提升,可以先使用再声明 ,值为undefined

    console.log(x) // undefined
    var x = 10

  • let:也会提升,但存在暂时性死区TDZ,声明前不能访问

    console.log(y) // ❌Cannot access 'y' before initialization
    let y = 20

3.重复声明

  • var:允许同一作用域重复声明,覆盖

    var n =1
    var n=2 //没问题

  • let同一块内禁止重复声明,直接报错

    let m=1
    let m=2 // ❌报错

4.全局挂载

复制代码
var g = 99
// 浏览器:var会挂载到window对象 window.g ===99

let gg =99
// let不会挂载到window

TS额外小提示

  1. 尽量不用var ,现代TS/JS优先用let(可修改) /const(只读)

  2. let允许后续重新赋值,const不允许重新赋值

    let num =1
    num=2 // ✅可以修改

    const num2=1
    num2=2 //❌

快速对照表

特性 var let
作用域 函数作用域 块级作用域 {}
提升 提升,访问得undefined 提升,暂时性死区,访问报错
重复声明 允许 禁止
全局挂载window
暂时性死区

总结:var老旧,漏洞多;写TS一律优先let/const,放弃var。

相关推荐
胡志辉的博客5 分钟前
【完全开源】IP 纯净度检测 可一键部署到自己的CF
前端·javascript·chrome·ip·chromium
Hilaku31 分钟前
作为面试官,我最怕遇到什么样的候选人?
前端·javascript·程序员
溪语流沙34 分钟前
Django + Vue电商项目第001讲:开篇|注册登录加增删改查,那不是电商
redis·python·mysql·docker·typescript·django·vue
TiDi1 小时前
Pinia优化重复请求
前端
web3d5201 小时前
01-用 Leafletjs 10 分钟搭一张水利一张图(Vue3 + Vite 实战)
前端·javascript
晚安日记wanna1 小时前
Vue2 的 defineProperty 差在哪四层追问筛掉九成候选人
前端·vue.js·面试
TiDi1 小时前
吸顶导航交互实现
前端
kisshyshy1 小时前
从Props透传到自定义Hook:系统梳理React跨层级通信与逻辑复用
前端·架构·代码规范
yume_sibai1 小时前
05-Flutter实战项目
前端·flutter
涛涛ing2 小时前
React 19.3 发布,但真正的赢家是 StyleX:当 AI 成为框架的“第一用户”
前端