让逻辑扁平化来提高代码可维护性和可读性
各行各业都在谈扁平化,对其最简单的理解就是追求简洁轻快,编程也不例外
JavaScript编程中,代码可维护性和可读性是一项任重道远的工作,它的优点灵活性同时也决定了它的缺点随意性
市面上很多框架理念等都可以很好的帮助我们优化代码,但是不代表可以完成代码优化的全部工作,同时我们需要提高本身代码可维护性和可读性
多层逻辑嵌套优化
工作中经常碰见类似的逻辑需求:满足条件a如何,否则如何;此时又满足条件b如何,否则如何...;最后才是条件全部满足如何。代码如下所示
if (a) { if (b) { if (c) { ... } else { console.log('C is not satisfied'); }; } else { console.log('B is not satisfied'); }; } else { console.log('A is not satisfied'); };
如果你经常碰见类似代码,会不会觉得这样的代码二次理解时会有点麻烦;尤其是这段代码超长,原本又不是你写的,再加上很多前后端工程师缩进问题上非常不讲究,坑坑洼洼的编码风格让你阅读维护时感受到了浓浓的恶意
现在我们做出这样的编码逻辑调整:在不满足各条件时层层中断,如return、throw;既把超长代码分段,同时也淡化了多层逻辑理解的难度。代码如下所示
if (!a) { console.log('A is not satisfied'); return false; }; if (!b) { console.log('B is not satisfied'); return false; }; if (!c) { console.log('C is not satisfied'); return false; }; ...
是不是感觉这样调整后,无论视觉上还是理解上都轻松了许多;符合我们互联网超长工作阶段化安排的思路
长逻辑判断优化
工作中时常碰见一段很长的逻辑,需判断很多条件同时满足时才执行代码。如下所示
if (((typeof a == 'object' && (a.x > 0 || a.y > 0)) || (typeof b == 'object' && (b.x + b.y) > a.x * 2)) && (typeof c == 'string' && !c.length > 0)) { ... };
如此真的太长了,阅读起来非常困难,需要我们做出一些优化来减轻逻辑判断过长带来的麻烦
最简单的办法是提取变量,根据不同功能或意图来拆分这段长逻辑判断。如下所示
var isA = typeof a == 'object' && (a.x > 0 || a.y > 0); var isB = typeof b == 'object' && (b.x + b.y) > a.x * 2; var isC = typeof c == 'string' && !c.length > 0; if ((isA || isB) && isC) { ... };