You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
functiontest(fruit,quantity){if(!fruit)return;// 如果 quantity 参数没有传入,设置默认值为 1constq=quantity||1;console.log(`We have ${q}${fruit}!`);}//test resultstest('banana');// We have 1 banana!test('apple',2);// We have 2 apple!
实际上,我们可以通过声明 默认函数参数 来消除变量 q。
functiontest(fruit,quantity=1){// 如果 quantity 参数没有传入,设置默认值为 1if(!fruit)return;console.log(`We have ${quantity}${fruit}!`);}//test resultstest('banana');// We have 1 banana!test('apple',2);// We have 2 apple!
5条可以尽可能的让你写出更好/干净的条件语句的建议。
1. 多重判断时使用 Array.includes
让我们看一下下面这个例子:
第一眼,上面这个例子看起来没问题。如果我们有更多名字叫 cherry 和 cranberries 的红色水果呢?我们准备用更多的 || 来拓展条件语句吗?
我们可以用 Array.includes (Array.includes)重写条件语句。
我们把红色的水果(red fruits)这一判断条件提取到一个数组。这样一来,代码看起来更整洁。
2. 更少的嵌套,尽早 Return
让我们拓展上一个例子让它包含两个条件。
我个人遵循的规则一般是在发现无效条件时,尽早Return。
这样一来,我们少了一层嵌套语句。这种编码风格非常好,尤其是当你有很长的if语句的时候(想象你需要滚动到最底层才知道还有else语句,这并不酷)
我们可以通过 倒置判断条件 & 尽早return 进一步减少if嵌套。看下面我们是怎么处理判断 条件2 的:
通过倒置判断条件2,我们的代码避免了嵌套语句。这个技巧在我们需要进行很长的逻辑判断时是非常有用的,特别是我们希望能够在条件不满足时能够停止下来进行处理。
而且这么做并不困难。问问自己,这个版本(没有嵌套)是不是比之前的(两层条件嵌套)更好,可读性更高?
3. 使用默认参数和解构
我猜下面的代码你可能会熟悉,在JavaScript中我们总是需要检查 null / undefined的值和指定默认值:
实际上,我们可以通过声明 默认函数参数 来消除变量 q。
4 .倾向于对象遍历而不是Switch语句
让我们看下面这个例子,我们想根据 color 打印出水果:
上面的代码看起来没有错误,但是我找到了一些累赘。用对象遍历实现相同的结果,语法看起来更简洁:
或者你也可以使用 Map实现相同的结果:
Map是一种在 ES2015 规范之后实现的对象类型,允许你存储 key 和 value 的值。
但我们是否应当禁止switch语句的使用呢?答案是不要限制你自己。从个人来说,我会尽可能的使用对象遍历,但我并不严格遵守它,而是使用对当前的场景更有意义的方式。
重构语法
5. 对 所有/部分 判断使用Array.every & Array.some
这最后一个建议更多是关于利用 JavaScript Array 的内置方法来减少代码行数。看下面的代码,我们想要检查是否所有水果都是红色:
代码那么长!我们可以通过 Array.every减少代码行数:
现在更简洁了,不是吗?相同的方式,如果我们想测试是否存在红色的水果,我们可以使用 Array.some 一行代码实现。
The text was updated successfully, but these errors were encountered: