ES11-可选链和其他知识补充

最新推荐文章于 2025-02-28 16:20:09 发布

XiaoYu2002-AI

最新推荐文章于 2025-02-28 16:20:09 发布

阅读量296

点赞数 10

CC 4.0 BY-SA版权

文章标签： javascript 前端 vue.js

本文链接：https://blog.csdn.net/weixin_70037637/article/details/137655745

JavaScript高级专栏收录该内容

30 篇文章

订阅专栏

本文介绍了ES11中的可选链语法，使得处理null和undefined更简洁；GlobalThis提供了一致的全局对象获取方式；for...in标准化了遍历对象属性的方法。此外，还提及了DynamicImport和Promise相关的新功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ES11 - Optional Chaining

可选链也是ES11中新增一个特性，主要作用是让我们的代码在进行null和undefined判断时更加清晰和简洁：

const obj = {
  name:"小余",
  friend:{
    name:"小满",
    // running:function(){
    //   console.log("running");
    // }
  }
}
//你在使用的时候，并不知道obj里面有没有friend这个，如果没有，obj.friend会返回undefined，在undefined上调用running就会报错
obj.friend.running();

//更严谨的做法，加入判断
if(obj.running || obj.friend.running){
  obj.friend.running()//判断后再决定调不调用，因为报错如果不try catch会导致后续代码无法执行
}

//可选链的用法(?.)，注意调用下面这个的时候要把前面的两种写法注释掉
obj?.friend?.running?.()//有就执行，没有就不执行了

ES11 - Global This（已学）

在之前我们希望获取JavaScript环境的全局对象，不同的环境获取的方式是不一样的
- 比如在浏览器中可以通过this、window来获取
- 比如在Node中我们需要通过global来获取
在ES11中对获取全局对象进行了统一的规范：globalThis

console.log(globalThis)//统一规范
console.log(this)//浏览器
console.log(global)//Node环境

ES11 - for…in标准化

在ES11之前，虽然很多浏览器支持for…in来遍历对象类型，但是并没有被ECMA标准化。
在ES11中，对其进行了标准化，for…in是用于遍历对象的key的：
for in 循环用于枚举对象的属性，for of 循环用于迭代可迭代对象（如数组）的元素。

区别：
1. for in 返回的是键名，而 for of 返回的是键值。
2. for in 遍历顺序是不确定的，而 for of 遍历顺序是确定的。
3. for in 可以迭代所有可枚举属性（包括继承的），而 for of 只能迭代定义在对象本身的属性。

const obj = {
  name:"小余",
  age:20
}

for(item in obj){//遍历
  console.log(item);
}

ES11 其他知识点

Dynamic Import：后续ES Module模块化中详细写
Promise.allSettled：后续讲Promise的时候详细写
import meta：后续ES Module模块化中详细写