vue3源码中为什么不使用?.可选链式操作符呢?

AI 概述
什么是可选链式操作符号?短路效应Vue3 源码中为什么不采用这么方便的操作符来自尤大的亲自解释 什么是可选链式操作符号? 可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) ...
目录
文章目录隐藏
  1. 什么是可选链式操作符号?
  2. 短路效应
  3. Vue3 源码中为什么不采用这么方便的操作符
  4. 来自尤大的亲自解释

什么是可选链式操作符号?

可选链操作符( ?. )允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined

当尝试访问可能不存在的对象属性时,可选链操作符将会使表达式更短、更简明。在探索一个对象的内容时,如果不能确定哪些属性必定存在,可选链操作符也是很有帮助的。

const adventurer = {
  name: 'Alice',
  cat: {
    name: 'Dinah'
  }
};

const dogName = adventurer.dog?.name;
console.log(dogName);
// expected output: undefined

console.log(adventurer.someNonExistentMethod?.());
// expected output: undefined

短路效应

如果 ?. 左边部分不存在,就会立即停止运算(“短路效应”)。

所以,如果后面有任何函数调用或者副作用,它们均不会执行。

let user = null; 
let x = 0; 
user?.sayHi(x++); 
// 没有 "sayHi",因此代码执行没有触达 x++ alert(x); // 0,值没有增加

Vue3 源码中为什么不采用这么方便的操作符

Vue3 源码中为什么不采用这么方便的操作符

看看这样是不是代码更简洁了,但是为什么这个 PR 没有被合并呢?

来自尤大的亲自解释

来自尤大的亲自解释

我们有意避免在代码库中使用可选链,因为我们的目标是 ES2016,而 TS 会将其转换为更加冗长的内容

从尤大的话中我们可以得知由于 Vu3 打包后的代码是基于 ES2016 的,虽然我们在编写代码时看起来代码比较简洁了,实际打包之后反而更冗余了,这样会增大包的体积,影响 Vu3 的加载速度。由此可见一个优秀的前端框架真的要考虑的东西很多,语法也会考虑周到。

以上关于vue3源码中为什么不使用?.可选链式操作符呢?的文章就介绍到这了,更多相关内容请搜索码云笔记以前的文章或继续浏览下面的相关文章,希望大家以后多多支持码云笔记。

「点点赞赏,手留余香」

1

给作者打赏,鼓励TA抓紧创作!

微信微信 支付宝支付宝

还没有人赞赏,快来当第一个赞赏的人吧!

声明:本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若内容造成侵权/违法违规/事实不符,请将相关资料发送至 admin@mybj123.com 进行投诉反馈,一经查实,立即处理!
重要:如软件存在付费、会员、充值等,均属软件开发者或所属公司行为,与本站无关,网友需自行判断
码云笔记 » vue3源码中为什么不使用?.可选链式操作符呢?

发表回复