console.log(a + a++ * ++ a)到底输出什么?

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 前言有些小伙伴可能看到这道题目就已经蒙圈了!甚至可能看不懂这道题目在干什么。其实这是一道比较考察基础的面试题,当你明白原理之后,你可能会感觉这道题也就那么回事,但是如果你没有思绪,那你可能觉得这道题很难。今天我们就来彻底看看这到底在做什么妖!

1.题目简介


这道题目很简单,面试官给出下面一段代码,问你输出什么?


代码如下

let a = 3
console.log(a + a++ * ++a);

小伙伴们别看题目简单就不以为意,通常题目越简单,给我们留下的坑就越多!


2.到底考察什么?


代码如此简单的一道题到底能够考察些我们什么知识呢?

别看题目简单,考察的知识点还挺多的,大概总结如下


知识点:

  • 运算符优先级
  • ++运算符
  • 表达式


可以看出,如此简单的一行代码就考察了我们三个知识点。

如果我们仔细阅读题目的话,也不难看出它要考察哪些知识点,比如我们分析一下代码:1111.png


3.运算符优先级复习


想要正确解答这道题目,运算符优先级的知识点我们是逃不过的,这里我们直接给出一张表,让大家复习一遍运算符的优先级规则。


运算符优先级:766.png

777.png

上面是一张完成的运算符优先级表格,小伙伴们可以简单过一遍,重点查看题目中涉及到的运算符。

注意:上表中的运算符优先级是基于 C 语言排的。


4.++运算符复习


++运算符是一个比较特殊的运算符,所以我们这里单独拿出来复习一遍。之所以特殊,是因为把++放在变量前面和放在变量后面是两种完全不同的效果,比如下面的案例。

++a 代码示例:

let a = 1;
console.log(++a); // 2

a++代码示例:

let a = 1;
console.log(a++); // 1
console.log(a); // 2

它们的区别也是显而易见的,从上面代码输出结果可以看出,++a 是先将 a1 之后输出结果,而 a++是输出结果之后再让 a1


5.题目解答


解答题目之前我们必须知道运算符优先级以及++运算符的知识点,题目中的表达式比较长,为了更好的解题,我们很有必要将表达式划分为几段,这也就是我们常说的逐个攻破


如何划分表达式就需要用到我们的运算符优先级知识了,我们先将题目中涉及到的运算符排个序。


5.1 运算符排序


代码a + a++ * ++a

涉及的运算符+ 、 ++ 、 *

运算符优先级排序++ > * > +



5.2 表达式分段


我们可以看到题目中的运算符总共有 3 级,因此我们可以考虑把这个表达式分为 3 段,而且需要根据运算符的优先级来分。


通常来说,小伙伴们可能会觉得哪个优先级更高,就先从哪里入手,但是我们发现这道题目这样做似乎不太利于我们理解,所以我们不防反过来,先从优先级低的入手。


第一次分段:799.png

第二次分段:7999.png

我们发现经过两次分段题目中的表达式就变为了 3 段,也达到了我们的效果了,接下来就看如何计算了。


5.3 分段计算

表达式被分为了三段,那么我们分别计算 3 段表达式即可。


题目回顾:

let a = 3
console.log(a + a++ * ++a);

先计算 a++:

a++ = 3

之所这儿输出 3,是因为++表达式放在变量后面是先输出结果,再计算 a+1,所以a++整体为 3


再计算++a:

++a = 5


这里是最容易出错的地方,因为我们前面先执行了 a++,所以此时的 a 应该是 4,然后执行++a的时候,这一个整体就变为了5


分块计算后的表达式:

我们可以将每一块的计算结果写成数字代入表达式看一下

3 + 3 * 5 = 18

上面那个表达式相信大家一眼就能看出来了吧,有些小伙伴可能对第一个 a=3 有一点点疑问:为什么++a 的时候 a 变为了 4,而第一个 a 还是为 3 呢?


因为我们再 JS 解释执行代码的时候其实都是从左往右开始的,当碰到第一个 a 时,就是 a 变量,直接赋为 3 即可,而到后面的++aa++都是表达式,都是需要计算得到结果的。


5.4 最终结果

通过上面的分析和计算,我们很容易得出答案:18

浏览器测试



总结

有些小伙伴觉得这道题非常的变态,实际项目中根本不可能这样写。事实却是如此,但是为什么各大厂还是喜欢考这种面试题呢?大概是为了最快的考察你的基础知识和应变能力吧,毕竟每天面试的人那么多。


如果觉得文章太繁琐或者没看懂,可以观看视频: 小猪课堂

相关实践学习
【涂鸦即艺术】基于云应用开发平台CAP部署AI实时生图绘板
【涂鸦即艺术】基于云应用开发平台CAP部署AI实时生图绘板
相关文章
|
4月前
|
人工智能 缓存 开发者
MCP协议究竟如何实现RAG与Agent的深度融合,打造更智能AI系统?
本文AI专家三桥君探讨了通过MCP协议实现RAG与Agent系统的深度融合,构建兼具知识理解与任务执行能力的智能系统。文章分析了传统RAG和Agent系统的局限性,提出了MCP协议的核心设计,包括标准化接口、智能缓存和动态扩展性。系统架构基于LlamaIndex和LangGraph实现服务端和客户端的协同工作,并提供了实际应用场景与生产部署指南。未来发展方向包括多模态扩展、增量更新和分布式处理等。
510 0
|
算法 定位技术
八叉树建立地图并实现路径规划导航(下)
八叉树建立地图并实现路径规划导航(下)
2817 0
八叉树建立地图并实现路径规划导航(下)
|
12月前
|
安全 前端开发 JavaScript
什么是 CSRF 攻击?如何启用 CSRF 保护来抵御该攻击?
什么是 CSRF 攻击?如何启用 CSRF 保护来抵御该攻击?
1746 5
|
8月前
|
安全 大数据 虚拟化
随着云计算和大数据技术的发展,Hyper-V在虚拟化领域的地位日益凸显
随着云计算和大数据技术的发展,Hyper-V在虚拟化领域的地位日益凸显。作为Windows Server的核心组件,Hyper-V具备卓越的技术性能,支持高可用性、动态迁移等功能,确保虚拟机稳定高效运行。它与Windows深度集成,管理便捷,支持远程管理和自动化部署,降低管理成本。内置防火墙、RBAC等安全功能,提供全方位安全保障。作为内置组件,Hyper-V无需额外购买软件,降低成本。其广泛的生态系统支持和持续增长的市场需求,使其成为企业虚拟化解决方案的首选。
|
存储 人工智能 自然语言处理
AI经营|多Agent择优生成商品标题
商品标题中关键词的好坏是商品能否被主搜检索到的关键因素,使用大模型自动优化标题成为【AI经营】中的核心能力之一,本文讲述大模型如何帮助商家优化商品素材,提升商品竞争力。
1281 62
AI经营|多Agent择优生成商品标题
|
10月前
|
人工智能 算法 机器人
对话汶生|或许你还没听过具身智能实训,但是已经有人这样做了
在汶生看来,具身智能真正的价值,在于基于现有成熟技术的可靠商业化,在于服务于成熟的市场。汽车产业、手机产业的发展路径已经验证,最终行业的领导者,不是技术领域的创新者,而是产品和商业化领域的创新者。
|
机器学习/深度学习 人工智能 算法
深度学习和强化学习有什么区别呢
【10月更文挑战第23天】深度学习和强化学习有什么区别呢
|
机器学习/深度学习 计算机视觉
YOLOv8改进 | 2023Neck篇 | 利用Damo-YOLO的RepGFPN改进特征融合层
YOLOv8改进 | 2023Neck篇 | 利用Damo-YOLO的RepGFPN改进特征融合层
654 0
YOLOv8改进 | 2023Neck篇 | 利用Damo-YOLO的RepGFPN改进特征融合层
|
存储 网络协议 数据安全/隐私保护
OSI七层模型 (详细讲解,看这一篇就够了)
OSI七层模型 (详细讲解,看这一篇就够了)
11574 0