代码简洁之路 [持续更新]

 关注

发布于: 2020 年 05 月 28 日

1、对对象参数使用解构使用场景：如果我们希望函数接收很多参数，那么应该使用对象。在此基础上，我们就可以使用解构语法提取我们需要的参数。
const greet = (obj) => {
  return `${obj.greeting}, ${obj.firstName}${obj.lastName}`;
}
// 使用解构更优雅
const greet = ({
  greeting,
  firstName,
  lastName
}) => {
  return `${greeting}, ${firstName}${lastName}`;
}
﻿
// 优点：这样我们可以少写很多重复的东西，命名也会更加清晰
2、命名回调函数
// 优点：增加代码可读性
const arr = [1, 2, 3].map(a => a * 2);
﻿
const double = a => a * 2;
const arr = [1, 2, 3].map(double);
3、增加条件语句的描述性
// 优点：增加代码可读性，代码更简洁
if (score === 100 ||
  remainingPlayers === 1 ||
  remainingPlayers === 0) {
  quitGame();
}
﻿
﻿
const winnerExists = () => {
  return score === 100 ||
    remainingPlayers === 1 ||
    remainingPlayers === 0
}
if (winnerExists()) {
  quitGame();
}
4、使用Map或者Object替换switch语句场景：switch语句太长，有多个return，容易出错；
const getValue = (prop) => {
  switch (prop) {
    case 'a': {
      return 1;
    }
    case 'b': {
      return 2;
    }
    case 'c': {
      return 3;
    }
  }
}
const val = getValue('a');
﻿
﻿
// 使用 Object 优化为： 
const obj = {
  a: 1,
  b: 2,
  c: 3
}
const val = obj['a'];
﻿
﻿
// 使用 Map 优化为：
const map = new Map([['a', 1], ['b', 2], ['c', 3]])
const val = map.get('a'
﻿
欢迎补充……
﻿

发布于: 2020 年 05 月 28 日阅读数: 29

原文链接:【http://xie.infoq.cn/article/f9ed44833850b7fac829b6725】。文章转载请联系作者。

吴昊泉

 关注

终身学习者 2017.11.30 加入

名校毕业，专业人士，财务自由，人格独立，思想理性。

发布

暂无评论