0

0

JavaScript ES6新特性有哪些_如何应用let和const【教程】

夢幻星辰

夢幻星辰

发布时间:2026-01-19 22:20:40

|

379人浏览过

|

来源于php中文网

原创

let和const本质区别在于绑定不可重赋值而非值不可变:const声明后不可重新赋值但可修改对象属性,let允许重新赋值但不允许重复声明,二者均有暂时性死区。

javascript es6新特性有哪些_如何应用let和const【教程】

ES6(ECMAScript 2015)不是“一堆语法糖”,而是重构了 JavaScript 的作用域、内存模型和模块行为。其中 letconst 是最基础也最容易误用的两个声明方式——它们不是 var 的替代品,而是为不同语义场景设计的独立工具

let 和 const 的本质区别:绑定不可重赋值 ≠ 值不可变

const 声明的是「绑定不可重新赋值」,不是「值不可变」。这意味着:

  • const 声明的对象、数组,其内部属性/元素仍可修改;只有重新赋值给该标识符会报错
  • let 允许后续赋值,但不允许重复声明;const 不允许重复声明,也不允许后续赋值
  • 两者都存在「暂时性死区(TDZ)」:在声明前访问会抛出 ReferenceError,而非 undefined
const obj = { a: 1 };
obj.a = 2;        // ✅ 合法:修改属性
obj = {};         // ❌ 报错:Cannot assign to const variable

let arr = [1];
arr.push(2);      // ✅ 合法:修改内容
arr = [3];        // ✅ 合法:let 允许重新赋值

什么时候必须用 let,而不是 const?

仅当变量在声明后**确定需要重新赋值**时才用 let。常见真实场景包括:

  • for 循环中需要每次迭代更新的计数器(如 for (let i = 0; i )
  • 异步回调中需暂存中间状态(如先设 let result,再在 .then() 中赋值)
  • 条件分支中需根据逻辑路径赋不同值(且无法用三元表达式一次性初始化)

反例:用 let 声明一个从不重新赋值的配置对象,既降低可读性,又失去 const 提供的静态检查保障。

立即学习Java免费学习笔记(深入)”;

A1.art
A1.art

一个创新的AI艺术应用平台,旨在简化和普及艺术创作

下载

var 还能用吗?哪些场景下它反而更合适?

绝大多数新代码应避免 var。但它在极少数边界场景仍有意义:

  • 需要函数作用域提升(hoisting)来实现「声明前可用」的兼容逻辑(如老式模块包装)
  • 全局污染明确可控的脚本环境(如浏览器控制台快速调试、某些构建后的 UMD 包顶层)
  • witheval 配合(不推荐,仅说明存在)

注意:var 的变量提升 + 函数作用域,在块级结构(如 iffor)中极易引发意外交互。例如:

if (false) { var x = 1; }
console.log(x); // undefined —— 不是 ReferenceError,也不是 1

容易被忽略的 TDZ 细节:typeof 不再是安全操作符

let/const 声明前使用 typeof 会直接报错,而不再是返回 "undefined"

console.log(typeof y); // ❌ ReferenceError: Cannot access 'y' before initialization
let y = 1;

这意味着你不能再靠 typeof xxx === 'undefined' 来判断变量是否存在——必须确保检查发生在声明之后,或改用 in 操作符(针对对象属性)、hasOwnPropertyglobalThis 等更明确的方式。

真正难的不是记住 letconst 的语法规则,而是每次声明时问自己一句:这个绑定是否应该被重新赋值?如果答案是否定的,就该用 const;如果连这个语义都模糊,说明变量职责可能过载,得先拆逻辑。

热门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新特性的相关的文章、下载、课程内容,供大家免费下载体验。

197

2023.08.04

JavaScript ES6新特性
JavaScript ES6新特性

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

231

2025.12.24

if什么意思
if什么意思

if的意思是“如果”的条件。它是一个用于引导条件语句的关键词,用于根据特定条件的真假情况来执行不同的代码块。本专题提供if什么意思的相关文章,供大家免费阅读。

846

2023.08.22

mysql标识符无效错误怎么解决
mysql标识符无效错误怎么解决

mysql标识符无效错误的解决办法:1、检查标识符是否被其他表或数据库使用;2、检查标识符是否包含特殊字符;3、使用引号包裹标识符;4、使用反引号包裹标识符;5、检查MySQL的配置文件等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

210

2023.12.04

Python标识符有哪些
Python标识符有哪些

Python标识符有变量标识符、函数标识符、类标识符、模块标识符、下划线开头的标识符、双下划线开头、双下划线结尾的标识符、整型标识符、浮点型标识符等等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

322

2024.02.23

java标识符合集
java标识符合集

本专题整合了java标识符相关内容,想了解更多详细内容,请阅读下面的文章。

292

2025.06.11

c++标识符介绍
c++标识符介绍

本专题整合了c++标识符相关内容,阅读专题下面的文章了解更多详细内容。

177

2025.08.07

C# ASP.NET Core微服务架构与API网关实践
C# ASP.NET Core微服务架构与API网关实践

本专题围绕 C# 在现代后端架构中的微服务实践展开,系统讲解基于 ASP.NET Core 构建可扩展服务体系的核心方法。内容涵盖服务拆分策略、RESTful API 设计、服务间通信、API 网关统一入口管理以及服务治理机制。通过真实项目案例,帮助开发者掌握构建高可用微服务系统的关键技术,提高系统的可扩展性与维护效率。

3

2026.03.11

热门下载

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

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 6万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 3.4万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 3.6万人学习

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

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