JavaScript 关键字与保留字学习笔记参考MDN《JavaScript 词法语法》中的「关键字 / 保留字」部分。本文在 MDN 内容基础上重新整理并加入学习角度的解释与实际开发建议。MDN 原文一键跳转目录JavaScript 关键字与保留字学习笔记一、先搞清楚什么是关键字二、关键字 ≠ 全部都是保留字三、标准保留字四、流程控制相关关键字1. break五、switch 相关关键字2. case3. default六、异常处理相关关键字4. try5. catch6. finally七、循环相关关键字7. for8. while9. do10. continuebreak 和 continue八、条件判断相关关键字11. if12. else九、函数相关关键字13. function14. return一个重要理解十、变量声明相关关键字15. var16. let17. const十一、类相关关键字18. class19. extends20. super十二、模块相关关键字21. import22. export前端非常重要十三、对象 / 类型相关关键字23. this注意24. new25. instanceof26. typeof注意经典问题27. in28. delete29. void30. with我的建议十四、值相关的保留关键字31. true32. false33. null十五、异常相关34. throw十六、调试相关35. debugger十七、switch / try 等结构中的其他关键字十八、未来保留关键字扩展十九、严格模式下保留的关键字注意二十、模块中的 await二十一、历史上的保留关键字二十二、一个非常容易踩坑的地方保留字可以当对象属性名为什么二十三、关键字 vs 标识符标识符是什么一个完整例子二十四、最值得你记住的分类① 声明② 条件③ 循环④ 函数⑤ 异步⑥ 异常⑦ 类⑧ 模块⑨ 类型 / 对象⑩ 值二十五、前端开发最常见的关键字二十六、不要“背关键字”要“理解语法”一、先搞清楚什么是关键字关键字Keyword是 JavaScript 中具有特殊语法意义的单词。例如asyncfunctiongetData(){// ...}这里的async就是一个具有特殊语法含义的关键字它告诉 JavaScript这个函数是异步函数。很多关键字看起来和普通变量名非常像constfunctionreturnclassifelsefor但它们不是普通的变量名而是 JavaScript 语法的一部分。可以把 JavaScript 想象成一门语言普通单词 → 变量名、函数名、对象属性名 关键字 → JavaScript 自己的“语法单词”例如constname张三这里const → JavaScript 的语法 name → 你自己定义的名字所以你不能随便写constconst123// ❌因为const已经被 JavaScript 占用了。二、关键字 ≠ 全部都是保留字这是 MDN 这一部分最容易让初学者混淆的地方。并不是所有关键字在所有情况下都不能作为标识符。例如constasync123async在某些上下文中仍然可以作为标识符。而constclass123则不允许。因此可以粗略理解成关键字 │ ├── 保留字 │ └── 不能作为普通标识符 │ ├── 上下文关键字 │ └── 在特定语法环境中才有特殊意义 │ └── 某些关键字 └── 在特定位置仍可能作为普通名字三、标准保留字下面这些单词属于 JavaScript 中的保留关键字不能作为普通变量、函数、类等的标识符。break case catch class const continue debugger default delete do else export extends false finally for function if import in instanceof new null return super switch this throw true try typeof var void while with下面逐个理解。四、流程控制相关关键字1. break用于终止循环或switch。for(leti0;i10;i){if(i5){break}console.log(i)}输出0 1 2 3 4break可以理解为“我不继续了直接退出当前循环 / switch。”常见于forwhileswitch五、switch 相关关键字2. case用于switch中匹配不同情况。switch(status){casesuccess:console.log(成功)breakcaseerror:console.log(失败)break}可以理解成如果 status success → 执行这里 如果 status error → 执行那里3. default用于switch中处理没有匹配到的情况。switch(status){casesuccess:console.log(成功)breakdefault:console.log(未知状态)}default就是“上面都没匹配到那就走这里。”六、异常处理相关关键字4. try用于尝试执行可能发生异常的代码。try{constdataJSON.parse(text)}5. catch捕获try中发生的异常。try{constdataJSON.parse(text)}catch(error){console.error(error)}6. finally无论前面的代码成功还是发生异常通常都会执行。try{// ...}catch(error){// ...}finally{// 清理工作}这一组可以记成try ↓ “试试看” catch ↓ “出错了我处理” finally ↓ “不管怎样最后做点收尾”前端非常常见loading.valuetruetry{awaitgetData()}catch(error){console.error(error)}finally{loading.valuefalse}七、循环相关关键字7. for创建循环。for(leti0;i10;i){console.log(i)}8. while当条件成立时不断执行。while(count10){count}9. do和while配合使用do{count}while(count10)和while的一个重要区别while → 先判断 → 再执行 do...while → 先执行一次 → 再判断10. continue跳过当前这一轮循环继续下一轮。for(leti0;i5;i){if(i2){continue}console.log(i)}结果0 1 3 4break 和 continue一定要区分break → 整个循环结束 continue → 当前这一轮结束下一轮继续八、条件判断相关关键字11. if条件成立时执行代码。if(age18){console.log(成年人)}12. elseif条件不成立时执行。if(age18){console.log(成年人)}else{console.log(未成年人)}九、函数相关关键字13. function声明函数。functionadd(a,b){returnab}现代前端你会同时看到functionadd(){}以及constadd(){}两者并不是简单的“新旧之分”。function是 JavaScript 的函数语法而箭头函数是另一种函数表达式语法。14. return从函数中返回结果并结束当前函数执行。functionadd(a,b){returnab}constresultadd(1,2)console.log(result)// 3一个重要理解return不是“打印结果”。而是把值交给调用这个函数的地方。十、变量声明相关关键字15. var声明变量。varname张三现代前端业务代码一般优先使用constlet而不是var。原因主要涉及块级作用域变量提升重复声明可读性现代 JavaScript 编码习惯16. let声明一个可以重新赋值的块级变量。letcount1count217. const声明一个不能重新赋值的绑定。constname张三// name 李四 // ❌注意constobj{name:张三}obj.name李四这是允许的。因为const限制的是变量绑定不能重新指向其他值而不是对象内部所有属性都不能修改十一、类相关关键字18. class声明类。classPerson{constructor(name){this.namename}sayHello(){console.log(你好我是${this.name})}}19. extends让一个类继承另一个类。classAnimal{eat(){console.log(吃东西)}}classDogextendsAnimal{bark(){console.log(汪汪)}}20. super访问父类的构造函数或方法。classDogextendsAnimal{constructor(name){super()this.namename}}这三个可以一起记class → 我创建一个类 extends → 我继承另一个类 super → 我要使用父类的东西十二、模块相关关键字21. import导入模块。import{ref}fromvue22. export导出模块。exportfunctiongetData(){// ...}也可以exportconstname张三前端非常重要现代 Vue / React 项目大量依赖importexport整个项目其实就是由大量模块连接起来的。例如Vue 页面 ↓ API ↓ 工具函数 ↓ 组件 ↓ 第三方库这些模块之间就是通过import / export连接的。十三、对象 / 类型相关关键字23. this表示当前执行上下文中的this值。constuser{name:张三,sayHello(){console.log(this.name)}}user.sayHello()输出张三注意this是 JavaScript 最容易让初学者困惑的知识点之一。尤其要区分function(){}和(){}普通函数拥有自己的this绑定规则而箭头函数不会创建自己的this。24. new创建对象实例。constdatenewDate()也可以用于构造函数constpersonnewPerson(张三)可以暂时理解成new → 根据一个构造函数 / 类创建一个新的实例25. instanceof判断一个对象是否属于某个构造函数或类的实例关系。constarr[]console.log(arrinstanceofArray)// true26. typeof获取一个值的类型字符串。typeof123// numbertypeofhello// stringtypeoftrue// boolean注意经典问题typeofnull// object这是 JavaScript 历史遗留行为。27. in判断某个属性名是否存在于对象或其原型链中。constuser{name:张三}console.log(nameinuser)// true28. delete删除对象属性。constuser{name:张三,age:20}deleteuser.age console.log(user)// { name: 张三 }当一个属性被标记为不可配置时delete 不会有任何效果并将返回 false。在严格模式下会抛出 TypeError。configurable: false 就是不可配置constobj{};Object.defineProperty(obj,name,{value:张三,configurable:false});Object.defineProperty() 默认就是 false29. void计算一个表达式但返回undefined。void0// undefined现代业务开发中比较少直接使用。30. withwith可以改变代码查找标识符的作用域。但是现代 JavaScript 中已经不推荐使用并且严格模式下不允许使用。我的建议看到它知道with → 历史语法 → 不要在现代业务代码中使用就够了。十四、值相关的保留关键字31. true布尔真值constvisibletrue32. false布尔假值constvisiblefalse33. null表示一个有意设置的“空值”。constusernull十五、异常相关34. throw主动抛出异常。thrownewError(请求失败)通常配合try{// ...}catch(error){// ...}使用。十六、调试相关35. debugger在代码中设置调试断点。functiontest(){debuggerconsole.log(hello)}当浏览器开发者工具打开并执行到这里时可以暂停代码。它相当于“浏览器请在这里停下来让我看看。”现代开发中比手动点断点少一些但理解它很有用。十七、switch / try 等结构中的其他关键字这些前面已经涉及但统一整理case default try catch finally throw可以形成一个知识链try ↓ 可能出错 ↓ catch ↓ 捕获异常 ↓ throw ↓ 主动抛出异常 ↓ finally ↓ 最终清理十八、未来保留关键字MDN 当前页面列出的未来保留关键字包括enum它目前没有普通 JavaScript 语法功能但被保留以避免未来语言扩展时产生冲突。“这个名字现在可能没什么特殊作用但 JavaScript 给未来的自己留了位置。”因此不要拿它当变量名。扩展TypeScript 有 enumenumColor{Red,Green,Blue}constcolorColor.Red;console.log(color);// 0十九、严格模式下保留的关键字以下关键字在严格模式下属于保留字implements // 实现接口 interface // 定义对象/类 let // 声明可以重新赋值的块级变量 package // js保留字 private // 私有成员 protected // 受保护成员 public // 公开成员 static // 静态成员例如use strictconstpublic123// ❌ SyntaxError注意其中一些单词在现代 JavaScript / class 语法中已经有实际用途。例如classUser{staticcreate(){}}所以不要简单理解成“这些单词永远都不能出现”。关键是它们在什么语法位置、什么模式下出现。关键字快速理解implements实现接口TypeScript 中让class按照某个interface的要求实现。interface定义对象/类应该具有什么结构TypeScript 的类型声明语法。let声明可以重新赋值的块级变量。packageJavaScript 的保留字目前一般不能作为普通标识符使用没有常规业务语法功能。private私有成员通常表示只能在类内部访问TypeScript 支持。protected受保护成员类自己和子类可以访问TypeScript 支持。public公开成员可以从外部访问TypeScript/class 中常见。static静态成员属于类本身而不是某个实例。二十、模块中的 awaitawait在模块代码中属于保留关键字。例如constdataawaitgetData()现代 JavaScript 支持模块顶层await。而在普通异步函数中asyncfunctiongetData(){constdataawaitrequest()}await用来等待 Promise 结果。二十一、历史上的保留关键字早期 ECMAScript 标准中还保留过一些未来可能使用的单词例如abstract // 抽象类/抽象方法相关关键字 boolean // 布尔类型 byte // 字节类型 char // 字符类型 double // 双精度浮点数类型 final // 表示不能继续修改/继承的成员或类 float // 单精度浮点数类型 goto // 无条件跳转语句 int // 整数类型 long // 长整数类型 native // 表示由底层/本地代码实现的方法 short // 短整数类型 synchronized // 用于线程同步 transient // 表示某些数据不参与序列化 volatile // 表示变量可能被多个线程修改现代 JavaScript 开发基本不需要使用这些词。知道它们属于历史遗留知识即可。注意下面很多关键字并不是 JavaScript 当前支持的语法而是其他编程语言中常见的关键字被 JavaScript 预留。关键字快速理解abstract抽象类/抽象方法相关关键字JavaScript 原生没有这个语法。boolean布尔类型表示true/falseJavaScript 中使用boolean类型概念但没有boolean关键字声明变量。byte字节类型通常表示 8 位整数JavaScript 原生没有byte类型。char字符类型JavaScript 没有独立的char类型单个字符也是string。double双精度浮点数类型JavaScript 的number本身就是双精度浮点数。final表示不能继续修改/继承的成员或类常见于 JavaJavaScript 没有final关键字。float单精度浮点数类型JavaScript 没有独立的float类型。goto无条件跳转语句常见于一些编程语言JavaScript 没有goto。int整数类型常见于 Java/C/CJavaScript 没有独立的int类型。long长整数类型常见于 Java/C/CJavaScript 没有long类型。native表示由底层/本地代码实现的方法常见于 JavaJavaScript 没有这个关键字。short短整数类型常见于 Java/C/CJavaScript 没有独立的short类型。synchronized用于线程同步常见于 JavaJavaScript 没有这个关键字。transient表示某些数据不参与序列化常见于 JavaJavaScript 没有这个关键字。volatile表示变量可能被多个线程修改常见于 Java/C/CJavaScript 没有这个关键字。二十二、一个非常容易踩坑的地方保留字可以当对象属性名例如constobj{import:hello,class:world}这是合法的。也可以console.log(obj.import)或者console.log(obj[import])但是不能这样functionimport(){}// ❌为什么因为对象属性名 → 不一定要求是普通 Identifier 变量名 / 函数名 → 必须符合 Identifier 的规则所以constobj{class:123}没问题。但是constclass123不行。二十三、关键字 vs 标识符这是学习 JavaScript 词法时最重要的概念之一。标识符是什么标识符就是你给变量、函数、类等取的名字。例如constuserName张三functiongetUser(){}classUser{}这里userName getUser User都是标识符。一个完整例子constuser{name:张三}functiongetName(){returnuser.name}可以拆成const ↓ 关键字 user ↓ 标识符 function ↓ 关键字 getName ↓ 标识符 return ↓ 关键字这样理解就非常清楚了。二十四、最值得你记住的分类① 声明var let const function class② 条件if else switch case default③ 循环for while do break continue④ 函数function return⑤ 异步async await注意async、await的保留和语法意义具有上下文差异。⑥ 异常try catch finally throw⑦ 类class extends super static⑧ 模块import export⑨ 类型 / 对象typeof instanceof in new this delete void⑩ 值true false null二十五、前端开发最常见的关键字如果你是前端开发不需要把所有关键字都当成同等重要。你应该优先熟悉const let function return if else for while break continue class extends new this typeof instanceof in try catch finally throw async await import export null true false这些在 Vue / React / TypeScript / Node.js 项目中都会频繁出现。二十六、不要“背关键字”要“理解语法”例如不要这样背return 返回 throw 抛出 break 跳出 continue 继续而应该通过代码理解functiongetUser(){if(!user){thrownewError(用户不存在)}returnuser}这里就同时理解了if throw return再例如try{constresawaitgetData()returnres}catch(error){console.error(error)}finally{loading.valuefalse}一次性就理解了try await return catch finally这比单纯背单词有效得多。声明 本篇内容在 MDN 内容基础上重新整理 
长河君 · 2026/9/3 17:03:09 · 阅读 1.2k JavaScript 关键字与保留字学习笔记详细讲解，一篇get ✅【JavaScript查缺补漏】
JavaScript 关键字与保留字学习笔记参考MDN《JavaScript 词法语法》中的「关键字 / 保留字」部分。本文在 MDN 内容基础上重新整理并加入学习角度的解释与实际开发建议。MDN 原文一键跳转目录JavaScript 关键字与保留字学习笔记一、先搞清楚什么是关键字二、关键字 ≠ 全部都是保留字三、标准保留字四、流程控制相关关键字1. break五、switch 相关关键字2. case3. default六、异常处理相关关键字4. try5. catch6. finally七、循环相关关键字7. for8. while9. do10. continuebreak 和 continue八、条件判断相关关键字11. if12. else九、函数相关关键字13. function14. return一个重要理解十、变量声明相关关键字15. var16. let17. const十一、类相关关键字18. class19. extends20. super十二、模块相关关键字21. import22. export前端非常重要十三、对象 / 类型相关关键字23. this注意24. new25. instanceof26. typeof注意经典问题27. in28. delete29. void30. with我的建议十四、值相关的保留关键字31. true32. false33. null十五、异常相关34. throw十六、调试相关35. debugger十七、switch / try 等结构中的其他关键字十八、未来保留关键字扩展十九、严格模式下保留的关键字注意二十、模块中的 await二十一、历史上的保留关键字二十二、一个非常容易踩坑的地方保留字可以当对象属性名为什么二十三、关键字 vs 标识符标识符是什么一个完整例子二十四、最值得你记住的分类① 声明② 条件③ 循环④ 函数⑤ 异步⑥ 异常⑦ 类⑧ 模块⑨ 类型 / 对象⑩ 值二十五、前端开发最常见的关键字二十六、不要“背关键字”要“理解语法”一、先搞清楚什么是关键字关键字Keyword是 JavaScript 中具有特殊语法意义的单词。例如asyncfunctiongetData(){// ...}这里的async就是一个具有特殊语法含义的关键字它告诉 JavaScript这个函数是异步函数。很多关键字看起来和普通变量名非常像constfunctionreturnclassifelsefor但它们不是普通的变量名而是 JavaScript 语法的一部分。可以把 JavaScript 想象成一门语言普通单词 → 变量名、函数名、对象属性名 关键字 → JavaScript 自己的“语法单词”例如constname张三这里const → JavaScript 的语法 name → 你自己定义的名字所以你不能随便写constconst123// ❌因为const已经被 JavaScript 占用了。二、关键字 ≠ 全部都是保留字这是 MDN 这一部分最容易让初学者混淆的地方。并不是所有关键字在所有情况下都不能作为标识符。例如constasync123async在某些上下文中仍然可以作为标识符。而constclass123则不允许。因此可以粗略理解成关键字 │ ├── 保留字 │ └── 不能作为普通标识符 │ ├── 上下文关键字 │ └── 在特定语法环境中才有特殊意义 │ └── 某些关键字 └── 在特定位置仍可能作为普通名字三、标准保留字下面这些单词属于 JavaScript 中的保留关键字不能作为普通变量、函数、类等的标识符。break case catch class const continue debugger default delete do else export extends false finally for function if import in instanceof new null return super switch this throw true try typeof var void while with下面逐个理解。四、流程控制相关关键字1. break用于终止循环或switch。for(leti0;i10;i){if(i5){break}console.log(i)}输出0 1 2 3 4break可以理解为“我不继续了直接退出当前循环 / switch。”常见于forwhileswitch五、switch 相关关键字2. case用于switch中匹配不同情况。switch(status){casesuccess:console.log(成功)breakcaseerror:console.log(失败)break}可以理解成如果 status success → 执行这里 如果 status error → 执行那里3. default用于switch中处理没有匹配到的情况。switch(status){casesuccess:console.log(成功)breakdefault:console.log(未知状态)}default就是“上面都没匹配到那就走这里。”六、异常处理相关关键字4. try用于尝试执行可能发生异常的代码。try{constdataJSON.parse(text)}5. catch捕获try中发生的异常。try{constdataJSON.parse(text)}catch(error){console.error(error)}6. finally无论前面的代码成功还是发生异常通常都会执行。try{// ...}catch(error){// ...}finally{// 清理工作}这一组可以记成try ↓ “试试看” catch ↓ “出错了我处理” finally ↓ “不管怎样最后做点收尾”前端非常常见loading.valuetruetry{awaitgetData()}catch(error){console.error(error)}finally{loading.valuefalse}七、循环相关关键字7. for创建循环。for(leti0;i10;i){console.log(i)}8. while当条件成立时不断执行。while(count10){count}9. do和while配合使用do{count}while(count10)和while的一个重要区别while → 先判断 → 再执行 do...while → 先执行一次 → 再判断10. continue跳过当前这一轮循环继续下一轮。for(leti0;i5;i){if(i2){continue}console.log(i)}结果0 1 3 4break 和 continue一定要区分break → 整个循环结束 continue → 当前这一轮结束下一轮继续八、条件判断相关关键字11. if条件成立时执行代码。if(age18){console.log(成年人)}12. elseif条件不成立时执行。if(age18){console.log(成年人)}else{console.log(未成年人)}九、函数相关关键字13. function声明函数。functionadd(a,b){returnab}现代前端你会同时看到functionadd(){}以及constadd(){}两者并不是简单的“新旧之分”。function是 JavaScript 的函数语法而箭头函数是另一种函数表达式语法。14. return从函数中返回结果并结束当前函数执行。functionadd(a,b){returnab}constresultadd(1,2)console.log(result)// 3一个重要理解return不是“打印结果”。而是把值交给调用这个函数的地方。十、变量声明相关关键字15. var声明变量。varname张三现代前端业务代码一般优先使用constlet而不是var。原因主要涉及块级作用域变量提升重复声明可读性现代 JavaScript 编码习惯16. let声明一个可以重新赋值的块级变量。letcount1count217. const声明一个不能重新赋值的绑定。constname张三// name 李四 // ❌注意constobj{name:张三}obj.name李四这是允许的。因为const限制的是变量绑定不能重新指向其他值而不是对象内部所有属性都不能修改十一、类相关关键字18. class声明类。classPerson{constructor(name){this.namename}sayHello(){console.log(你好我是${this.name})}}19. extends让一个类继承另一个类。classAnimal{eat(){console.log(吃东西)}}classDogextendsAnimal{bark(){console.log(汪汪)}}20. super访问父类的构造函数或方法。classDogextendsAnimal{constructor(name){super()this.namename}}这三个可以一起记class → 我创建一个类 extends → 我继承另一个类 super → 我要使用父类的东西十二、模块相关关键字21. import导入模块。import{ref}fromvue22. export导出模块。exportfunctiongetData(){// ...}也可以exportconstname张三前端非常重要现代 Vue / React 项目大量依赖importexport整个项目其实就是由大量模块连接起来的。例如Vue 页面 ↓ API ↓ 工具函数 ↓ 组件 ↓ 第三方库这些模块之间就是通过import / export连接的。十三、对象 / 类型相关关键字23. this表示当前执行上下文中的this值。constuser{name:张三,sayHello(){console.log(this.name)}}user.sayHello()输出张三注意this是 JavaScript 最容易让初学者困惑的知识点之一。尤其要区分function(){}和(){}普通函数拥有自己的this绑定规则而箭头函数不会创建自己的this。24. new创建对象实例。constdatenewDate()也可以用于构造函数constpersonnewPerson(张三)可以暂时理解成new → 根据一个构造函数 / 类创建一个新的实例25. instanceof判断一个对象是否属于某个构造函数或类的实例关系。constarr[]console.log(arrinstanceofArray)// true26. typeof获取一个值的类型字符串。typeof123// numbertypeofhello// stringtypeoftrue// boolean注意经典问题typeofnull// object这是 JavaScript 历史遗留行为。27. in判断某个属性名是否存在于对象或其原型链中。constuser{name:张三}console.log(nameinuser)// true28. delete删除对象属性。constuser{name:张三,age:20}deleteuser.age console.log(user)// { name: 张三 }当一个属性被标记为不可配置时delete 不会有任何效果并将返回 false。在严格模式下会抛出 TypeError。configurable: false 就是不可配置constobj{};Object.defineProperty(obj,name,{value:张三,configurable:false});Object.defineProperty() 默认就是 false29. void计算一个表达式但返回undefined。void0// undefined现代业务开发中比较少直接使用。30. withwith可以改变代码查找标识符的作用域。但是现代 JavaScript 中已经不推荐使用并且严格模式下不允许使用。我的建议看到它知道with → 历史语法 → 不要在现代业务代码中使用就够了。十四、值相关的保留关键字31. true布尔真值constvisibletrue32. false布尔假值constvisiblefalse33. null表示一个有意设置的“空值”。constusernull十五、异常相关34. throw主动抛出异常。thrownewError(请求失败)通常配合try{// ...}catch(error){// ...}使用。十六、调试相关35. debugger在代码中设置调试断点。functiontest(){debuggerconsole.log(hello)}当浏览器开发者工具打开并执行到这里时可以暂停代码。它相当于“浏览器请在这里停下来让我看看。”现代开发中比手动点断点少一些但理解它很有用。十七、switch / try 等结构中的其他关键字这些前面已经涉及但统一整理case default try catch finally throw可以形成一个知识链try ↓ 可能出错 ↓ catch ↓ 捕获异常 ↓ throw ↓ 主动抛出异常 ↓ finally ↓ 最终清理十八、未来保留关键字MDN 当前页面列出的未来保留关键字包括enum它目前没有普通 JavaScript 语法功能但被保留以避免未来语言扩展时产生冲突。“这个名字现在可能没什么特殊作用但 JavaScript 给未来的自己留了位置。”因此不要拿它当变量名。扩展TypeScript 有 enumenumColor{Red,Green,Blue}constcolorColor.Red;console.log(color);// 0十九、严格模式下保留的关键字以下关键字在严格模式下属于保留字implements // 实现接口 interface // 定义对象/类 let // 声明可以重新赋值的块级变量 package // js保留字 private // 私有成员 protected // 受保护成员 public // 公开成员 static // 静态成员例如use strictconstpublic123// ❌ SyntaxError注意其中一些单词在现代 JavaScript / class 语法中已经有实际用途。例如classUser{staticcreate(){}}所以不要简单理解成“这些单词永远都不能出现”。关键是它们在什么语法位置、什么模式下出现。关键字快速理解implements实现接口TypeScript 中让class按照某个interface的要求实现。interface定义对象/类应该具有什么结构TypeScript 的类型声明语法。let声明可以重新赋值的块级变量。packageJavaScript 的保留字目前一般不能作为普通标识符使用没有常规业务语法功能。private私有成员通常表示只能在类内部访问TypeScript 支持。protected受保护成员类自己和子类可以访问TypeScript 支持。public公开成员可以从外部访问TypeScript/class 中常见。static静态成员属于类本身而不是某个实例。二十、模块中的 awaitawait在模块代码中属于保留关键字。例如constdataawaitgetData()现代 JavaScript 支持模块顶层await。而在普通异步函数中asyncfunctiongetData(){constdataawaitrequest()}await用来等待 Promise 结果。二十一、历史上的保留关键字早期 ECMAScript 标准中还保留过一些未来可能使用的单词例如abstract // 抽象类/抽象方法相关关键字 boolean // 布尔类型 byte // 字节类型 char // 字符类型 double // 双精度浮点数类型 final // 表示不能继续修改/继承的成员或类 float // 单精度浮点数类型 goto // 无条件跳转语句 int // 整数类型 long // 长整数类型 native // 表示由底层/本地代码实现的方法 short // 短整数类型 synchronized // 用于线程同步 transient // 表示某些数据不参与序列化 volatile // 表示变量可能被多个线程修改现代 JavaScript 开发基本不需要使用这些词。知道它们属于历史遗留知识即可。注意下面很多关键字并不是 JavaScript 当前支持的语法而是其他编程语言中常见的关键字被 JavaScript 预留。关键字快速理解abstract抽象类/抽象方法相关关键字JavaScript 原生没有这个语法。boolean布尔类型表示true/falseJavaScript 中使用boolean类型概念但没有boolean关键字声明变量。byte字节类型通常表示 8 位整数JavaScript 原生没有byte类型。char字符类型JavaScript 没有独立的char类型单个字符也是string。double双精度浮点数类型JavaScript 的number本身就是双精度浮点数。final表示不能继续修改/继承的成员或类常见于 JavaJavaScript 没有final关键字。float单精度浮点数类型JavaScript 没有独立的float类型。goto无条件跳转语句常见于一些编程语言JavaScript 没有goto。int整数类型常见于 Java/C/CJavaScript 没有独立的int类型。long长整数类型常见于 Java/C/CJavaScript 没有long类型。native表示由底层/本地代码实现的方法常见于 JavaJavaScript 没有这个关键字。short短整数类型常见于 Java/C/CJavaScript 没有独立的short类型。synchronized用于线程同步常见于 JavaJavaScript 没有这个关键字。transient表示某些数据不参与序列化常见于 JavaJavaScript 没有这个关键字。volatile表示变量可能被多个线程修改常见于 Java/C/CJavaScript 没有这个关键字。二十二、一个非常容易踩坑的地方保留字可以当对象属性名例如constobj{import:hello,class:world}这是合法的。也可以console.log(obj.import)或者console.log(obj[import])但是不能这样functionimport(){}// ❌为什么因为对象属性名 → 不一定要求是普通 Identifier 变量名 / 函数名 → 必须符合 Identifier 的规则所以constobj{class:123}没问题。但是constclass123不行。二十三、关键字 vs 标识符这是学习 JavaScript 词法时最重要的概念之一。标识符是什么标识符就是你给变量、函数、类等取的名字。例如constuserName张三functiongetUser(){}classUser{}这里userName getUser User都是标识符。一个完整例子constuser{name:张三}functiongetName(){returnuser.name}可以拆成const ↓ 关键字 user ↓ 标识符 function ↓ 关键字 getName ↓ 标识符 return ↓ 关键字这样理解就非常清楚了。二十四、最值得你记住的分类① 声明var let const function class② 条件if else switch case default③ 循环for while do break continue④ 函数function return⑤ 异步async await注意async、await的保留和语法意义具有上下文差异。⑥ 异常try catch finally throw⑦ 类class extends super static⑧ 模块import export⑨ 类型 / 对象typeof instanceof in new this delete void⑩ 值true false null二十五、前端开发最常见的关键字如果你是前端开发不需要把所有关键字都当成同等重要。你应该优先熟悉const let function return if else for while break continue class extends new this typeof instanceof in try catch finally throw async await import export null true false这些在 Vue / React / TypeScript / Node.js 项目中都会频繁出现。二十六、不要“背关键字”要“理解语法”例如不要这样背return 返回 throw 抛出 break 跳出 continue 继续而应该通过代码理解functiongetUser(){if(!user){thrownewError(用户不存在)}returnuser}这里就同时理解了if throw return再例如try{constresawaitgetData()returnres}catch(error){console.error(error)}finally{loading.valuefalse}一次性就理解了try await return catch finally这比单纯背单词有效得多。声明 本篇内容在 MDN 内容基础上重新整理