0

0

let和const是什么_它们与var有什么区别【教程】

幻影之瞳

幻影之瞳

发布时间:2026-01-30 20:05:20

|

997人浏览过

|

来源于php中文网

原创

let和const是ES6引入的块级作用域变量声明方式,解决var的作用域模糊、变量提升、重复声明等问题;let/const有暂时性死区且不挂载到window,const仅保证绑定不可变。

let和const是什么_它们与var有什么区别【教程】

letconst 是 ES6(ECMAScript 2015)引入的变量声明方式,用来替代老旧的 var。它们不是“更高级的 var”,而是从设计上就解决了 var 的几个关键缺陷:作用域模糊、变量提升导致的意外行为、重复声明失控等。


为什么在 if 或 for 里用 var 会“泄露”变量?

var 只有函数作用域(或全局作用域),没有块级作用域。哪怕你写在 {} 里,只要不在函数内,它就会“冒出来”。

常见错误现象:
for (var i = 0; i console.log(i), 0); } → 全部输出 3,因为 i 是共享的、最终值为 3 的全局/函数级变量。

let 就能自然解决:
for (let i = 0; i console.log(i), 0); } → 输出 012,每次循环都绑定独立的 i

  • letconst 都是块级作用域:iffor{} 内声明,外部就访问不到
  • var 在这些块里声明,仍属于外层函数或全局作用域
  • 这直接影响闭包行为、循环逻辑、条件分支变量隔离

“暂时性死区(TDZ)”到底卡在哪?

这不是玄学,是明确的运行时限制:在 letconst 声明语句执行前,该变量名处于“不可访问”状态。

错误示例:
console.log(x); let x = 10; → 报错 ReferenceError: Cannot access 'x' before initialization

对比 var
console.log(y); var y = 10; → 输出 undefined(变量被提升,但值未赋)

python学习笔记与简明教程 中文WORD版 2.03MB
python学习笔记与简明教程 中文WORD版 2.03MB

本文档是python学习笔记与简明教程;为什么用Python作为编程入门语言?每种语言都会有它的支持者和反对者。去Google一下“why python”,你会得到很多结果,诸如应用范围广泛、开源、社区活跃、丰富的库、跨平台等等等等,也可能找到不少对它的批评,格式死板、效率低、国内用的人很少之类。不过这些优缺点的权衡都是程序员们的烦恼。作为一个想要学点编程入门的初学者来说,简单才是最重要的。当学C++的同学还在写链表,学Java的同学还在折腾运行环境的时候,学Pyt

下载
  • TDZ 不是语法错误,是运行时报错;说明引擎确实“知道”这个变量,只是拒绝提前使用
  • const 同样有 TDZ,且还强制要求声明即赋值:const z; 直接报错 SyntaxError
  • 容易踩的坑:在模块顶部 import 之前写 console.log(XXX),而 XXX 是 let/const 声明的 —— 也会触发 TDZ

const 真的“不可变”吗?为什么对象还能 push?

const 保证的是“绑定不可变”,即变量名不能重新指向另一个内存地址,而不是“值不可变”。

合法操作:
const arr = [1]; arr.push(2); // ✅ OK,arr 仍指向原数组
const obj = {}; obj.name = 'Alice'; // ✅ OK,obj 仍指向原对象

非法操作:
const arr = [1]; arr = [2]; // ❌ TypeError: Assignment to constant variable
const obj = {}; obj = {}; // ❌ 同样报错

  • 基本类型(stringnumberboolean)用 const 确实完全不可改
  • 引用类型(ObjectArrayMap 等)只锁住引用,不冻结内容
  • 如需真正冻结,得用 Object.freeze()structuredClone() + 替换,但那是另一层需求了

为什么全局下用 var 会挂到 window 上,而 let/const 不会?

这是历史包袱问题:var 在全局作用域声明时,会同时成为全局对象(浏览器中是 window)的属性;letconst 则完全不参与这一映射。

实操验证:
var a = 1; console.log(window.a); // 1
let b = 2; console.log(window.b); // undefined
const c = 3; console.log(window.c); // undefined

  • 这意味着用 var 声明全局变量,可能无意污染 window,引发命名冲突(比如和第三方库同名)
  • 现代模块系统(ESM)默认严格模式,var 更无存在必要
  • 工程实践中,应默认用 const,仅当需要重赋值时改用 let,彻底弃用 var

最常被忽略的一点:函数参数作用域与 let 的冲突。例如 function foo(arg) { let arg = 1; } 会直接报错 —— 因为参数本身已在当前块级作用域中声明,let 不允许重复绑定。这种细节,在重构旧代码或写高阶函数时极易翻车。

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

106

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

195

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

222

2025.12.24

es6新特性
es6新特性

es6新特性有:1、块级作用域变量;2、箭头函数;3、模板字符串;4、解构赋值;5、默认参数;6、 扩展运算符;7、 类和继承;8、Promise。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

106

2023.07.17

es6新特性有哪些
es6新特性有哪些

es6的新特性有:1、块级作用域;2、箭头函数;3、解构赋值;4、默认参数;5、扩展运算符;6、模板字符串;7、类和模块;8、迭代器和生成器;9、Promise对象;10、模块化导入和导出等等。本专题为大家提供es6新特性的相关的文章、下载、课程内容,供大家免费下载体验。

195

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

ES6是JavaScript的根本性升级,引入let/const实现块级作用域、箭头函数解决this绑定问题、解构赋值与模板字符串简化数据处理、对象简写与模块化提升代码可读性与组织性。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

222

2025.12.24

string转int
string转int

在编程中,我们经常会遇到需要将字符串(str)转换为整数(int)的情况。这可能是因为我们需要对字符串进行数值计算,或者需要将用户输入的字符串转换为整数进行处理。php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

463

2023.08.02

java中boolean的用法
java中boolean的用法

在Java中,boolean是一种基本数据类型,它只有两个可能的值:true和false。boolean类型经常用于条件测试,比如进行比较或者检查某个条件是否满足。想了解更多java中boolean的相关内容,可以阅读本专题下面的文章。

350

2023.11.13

C++ 设计模式与软件架构
C++ 设计模式与软件架构

本专题深入讲解 C++ 中的常见设计模式与架构优化,包括单例模式、工厂模式、观察者模式、策略模式、命令模式等,结合实际案例展示如何在 C++ 项目中应用这些模式提升代码可维护性与扩展性。通过案例分析,帮助开发者掌握 如何运用设计模式构建高质量的软件架构,提升系统的灵活性与可扩展性。

9

2026.01.30

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
ECMAScript6 / ES6---十天技能课堂
ECMAScript6 / ES6---十天技能课堂

共25课时 | 2万人学习

HTML5/CSS3/JavaScript/ES6入门课程
HTML5/CSS3/JavaScript/ES6入门课程

共102课时 | 6.8万人学习

HTML+CSS基础与实战
HTML+CSS基础与实战

共132课时 | 9.9万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号