首页
题库
公司真题
专项练习
面试题库
在线编程
面试
面试经验
AI 模拟面试
简历
求职
学习
基础学习课
实战项目课
求职辅导课
专栏&文章
竞赛
搜索
我要招人
发布职位
发布职位、邀约牛人
更多企业解决方案
AI面试、笔试、校招、雇品
HR免费试用AI面试
最新面试提效必备
登录
/
注册
聪敏的卡尔在开会
郑州大学 前端工程师
发布于北京
关注
已关注
取消关注
@程序员鱼皮:
这些代码,差点把我气出内伤
大家好,我是鱼皮,一个正在烂代码的泥潭里面摸爬滚打的程序员。先问大家一个小问题:你觉得看别人代码累,还是自己写代码累?我相信有很多朋友会说,当然是自己写代码累了,要思考逻辑、要动手敲键盘,身心俱疲啊;但是,如果你需要经常阅读别人的代码,尤其是烂代码,答案就不一定了。因为自己写代码,逻辑是自己来梳理的、代码自己是熟悉的;但是看别人的代码,你就要去理解别人的代码逻辑,再加上烂代码的加持,可能很简单的逻辑,你都得看半天才能懂。所以很多大佬在面对前人的 “屎山” 项目时,宁愿自己重写,也不去读烂代码。举个夸张的例子:让你实现 1 + 1 的求和自己写:let sum = 1 + 1;某烂代码可能是:let a = {};let b = {};a.toString = function() { return 1;};b.valueOf = function() { return "1";};let sum = a + b;把简单的逻辑搞复杂,便是绝大多数程序员的拿手好戏(当然也包括我)。因为我从大学就开始带团队做项目了嘛,所以经常会审查团队同学的代码,做好二次校验。包括现在虽然开公司了,前端 / 后端同学的代码,也都会在我这过一遍才会发布上线。总之算是看了很多代码,其中有一些真的是让我哭笑不得。下面给大家分享一些代码片段出来,希望大家 不要学习 。1、过于抽象的命名还记得咱们刚学编程的时候,变量的命名都是用的 abcdefg。自学时这么写完全没问题,但是在实际项目中,如果还用过于抽象的命名,那就不太合适了。比如下面这段,大家能看懂是什么意思么?const [l, setL] = useState<boolean>(false);const [d, setD] = useState<any>();但如果我稍微完善下命名呢:const [loading, setLoading] = useState<boolean>(false);const [data, setData] = useState<any>();很多同学应该立刻能看懂了,一个是 “加载中” 的变量,一个是 “存储数据” 的变量。最好的代码应该是不用写注释的,因为 代码即注释 。如果你能把命名做到 “见名知义”,看代码的人会极度舒适。2、有深度的代码比如下面这段:if (condition1) { // 逻辑 A if (condition2) { // 逻辑 B if (condition3) { // 逻辑 C if (condition4) { // 逻辑 D } } }}这里的深度有 2 重含义,一重是字面意思:代码一层嵌一层、深不见底;另外一重是指真的 “很有深度” —— 指让人看不懂。阅读这段代码的感觉就像是你在一座巨大的迷宫里,每次转弯都要判断下是左还是右,最后你只会迷失方向。如何改进呢?最简单直接的方法就是使用早返回策略(early return):if (!condition1) // 逻辑 A return;if (!condition2) // 逻辑 B return;if (!condition3) // 逻辑 C return;if (!condition4) // 逻辑 D return;这样,你的代码就清晰了很多,阅读这种代码的感觉就像是走在了一条直路上,前方的路一目了然。当然,还可以将一些逻辑抽象成独立函数来简化代码,或者使用设计模式来优化。怎么判断一段代码是否过于复杂、应该优化了呢?这里提到一个概念: 圈复杂度 ,这是一种量化代码复杂程度的概念。通常你代码中的 if else 分支越多,圈复杂度就越高,代码就越复杂。企业中一般建议圈复杂度不要超过 10 - 15,我个人的编码习惯是一般不会在代码中出现 3 层以上的嵌套(除非必要)。3、冗余代码这是我遇到最多的问题!分为 3 种情况:能用一行代码搞定,偏偏要写 10 行能用一个变量或函数搞定,偏偏每次都是复制粘贴重复写没有用到的代码,又不舍得删除举个例子,下面这段前端代码,大家觉得有什么问题:这是我们鱼聪明 AI 前端开发过程的真实代码<Spin spinning={!(currDownloadUrl || originPictureUrl || pictureUrl)}> {type === DRAW_APP ? ( drawImg(image) ) : ( drawImg(currDownloadUrl || originPictureUrl || pictureUrl) )}</Spin>第一眼看到这段代码时,我就发现了,判断 spinning(旋转)的代码逻辑比较复杂,包含了两个 || 逻辑。而下面的 drawImg 函数的参数中,又包含了这段一模一样的逻辑。这段判断,其实就是冗余代码,完全没必要写两遍!我调整过后的代码如下:// 要展示的图片地址const showPictureUrl = currDownloadUrl || originPictureUrl || pictureUrl;直接定义一个通用变量,写上清晰的注释,其他地方要使用时就无需关注内部判断逻辑,看注释就行了。这就是所谓的 DRY 原则(Don't Repeat Yourself) ,尽量避免代码冗余。如果你在多处写下相同的代码,那么当需要修改这段代码时,你就需要在所有这些地方都修改,漏一个地方就是一个 Bug。还有,关于项目中没有用到的函数和变量,如果你近期没有使用计划,不妨就删除或者注释掉,别舍不得。利用好 Git 版本控制系统,只要你的代码提交信息写得好,要用到被删掉的历史代码时,去提交记录里找即可。注意,如果是学习时写代码,多保留一些也是合理的。但企业项目中,项目代码精简凝练些会更好。这里打个比方,写代码就像是我在公司里堆东西,一开始总觉得多一点没关系,反正有空间。但是,冗余代码就像是杂物,会越堆越多,迟早有一天,会影响到你,就像我们公司现在一样(右边有一堆杂物):大概就分享到这里,请大家在评论区 @ 出你写烂代码的同事吧 🐶 ~
点赞 135
评论 17
全部评论
推荐
最新
楼层
暂无评论,快来抢首评~
相关推荐
11-02 22:35
湖南大学 Web前端
华为Web前端开发一面
1.实习项目介绍 2.华为云控制台页面存在大量表单组件(如输入框、下拉选择、复选框),如何实现表单的统一校验逻辑?需支持必填、格式(如IP地址、端口号)、范围(如数值区间)校验,如何处理校验结果的实时反馈与错误提示? 3.JavaScript中的原型链是什么?请结合实例说明原型链的继承机制,在华为开发者平台的“用户类”设计中,如何利用原型链实现不同角色用户(普通用户、开发者、管理员)的属性与方法复用? 4.华为智慧园区管理系统需要展示复杂的设备状态仪表盘,如何用CSS实现响应式布局,确保在PC端、平板端、手机端都能清晰展示数据?如何处理不同屏幕尺寸下图表组件的自适应缩放? 5.React中的虚...
查看7道真题和解析
点赞
评论
收藏
分享
11-05 16:58
已编辑
门头沟学院 C++
活久见!知名互联网中厂,竟然做出这种事情!!!
如题,主包在10月13日参加了x米的一面,一周后打电话咨询一面面试官结果,得知一面通过,让我静等二面,直到昨天,还没有收到二面的通知,于是联系在x米内部的同学帮忙问一下hr,结果竟然是流程已中止!我不敢相信,再次发短信给一面面试官,得知结果也是一面通过了,但是不知道为什么流程结束了!所以。。。是不是至少二面kpi一下或者一面直接挂掉呢?无语至极。。。同样的事情今天再次发生,这次的主角是杭州四大xxx之一的ths,主包10.15日一面,当场被面试官加微信,一周后微信咨询得知面试通过,耐心等待二面,经过x米事件之后心有余悸,于是再次主动咨询二面什么时候发起,结果竟然是二面取消了,原因是有一个学生已...
点赞
评论
收藏
分享
10-14 17:03
中国计量大学 Java
双非还有机会吗,求拷打
刚过完第一遍八股。。。
辅助位:
定时器项目都被用烂了,感觉
点赞
评论
收藏
分享
09-12 23:50
武汉工程科技学院 运营
有人知道这个岗位是干啥的嘛
点赞
评论
收藏
分享
11-07 10:28
联想_后端开发部_语音算法工程师(准入职员工)
联想内推,联想内推码
26届联想 | 材料工程师 |面试经验分享!1. 请做一个简短的自我介绍。2. 为什么选择联想材料工程师岗位?你对“材料创新支撑产品竞争力”的理解是什么?3. 分享一次你参与材料实验或研究项目的经历,关键思路是什么?4. 如果研发团队与生产部门对材料工艺有分歧,你会如何沟通协调?5. 你认为材料工程师最核心的非专业能力是什么?你的优势在哪里?6. 描述一次你通过主动学习掌握新材料分析方法的经历,如何应用于实践?7. 如何看待“材料性能指标”与“生产成本控制”的关系?请举例说明平衡策略。8. 分享一次你在团队中推动实验项目落地的经历,遇到的最大挑战是什么?9. 如果你负责高分子涂层材料研究,如何...
点赞
评论
收藏
分享
评论
点赞成功,聊一聊 >
点赞
收藏
分享
评论
提到的真题
返回内容
全站热榜
更多
1
...
那个敢跟leader对线的实习生,现在怎样了
4364
2
...
数字马力一面(已挂)
3843
3
...
字节业务中台后端开发一面
2826
4
...
27找实习,简历求拷打
2570
5
...
数字马力 一面
2528
6
...
转测开是我大学生涯做过最正确的选择
2435
7
...
中兴逼签要接吗?最纠结的一集
2173
8
...
实习才知道原来攒钱这么不容易(给新人小白)
2115
9
...
数字马力一面
2014
10
...
云智一面完变筛选中
2004
创作者周榜
更多
正在热议
更多
#
你实习是赚钱了还是亏钱了?
#
30587次浏览
241人参与
#
2022毕业即失业取暖地
#
116633次浏览
705人参与
#
360集团校招
#
21942次浏览
164人参与
#
用一句话形容你的团队氛围
#
18638次浏览
179人参与
#
CVTE求职进展汇总
#
23185次浏览
320人参与
#
你找工作是从容有余 or 匆忙滚爬?
#
12192次浏览
94人参与
#
联影求职进展汇总
#
51443次浏览
325人参与
#
哪些公司校招卡第一学历
#
220372次浏览
777人参与
#
牛客租房专区
#
122995次浏览
1347人参与
#
机械人与华为的爱恨情仇
#
137467次浏览
1013人参与
#
海康威视工作体验
#
45765次浏览
157人参与
#
腾讯音乐求职进展汇总
#
136204次浏览
1005人参与
#
嵌入式岗知多少
#
58835次浏览
548人参与
#
联影医疗求职进展汇总
#
6272次浏览
25人参与
#
毕业论文进行时
#
6886次浏览
81人参与
#
同bg的你秋招战况如何?
#
174854次浏览
1022人参与
#
找实习你看重大厂光环还是业务方向
#
41637次浏览
164人参与
#
58同城求职进展汇总
#
40312次浏览
263人参与
#
我来点评面试官
#
16730次浏览
114人参与
#
面对逼签的应对技巧
#
7293次浏览
37人参与
#
扒一扒那些奇葩实习经历
#
126894次浏览
1100人参与
牛客网
牛客网在线编程
牛客网题解
牛客企业服务