Jimmy:6个规则去净化你的代码

妖狐艹你老母 2022-12-22 14:28 154阅读 0赞

可读性代码就是可维护性代码!

1、注重命名

为一个事件命名是很困难的。虽然困难但是非常有必要。

想象以下，将两个数组合并成一个数组，并生成一个唯一值的数组。那么你会怎么命名它呢?我们也许会这样命名?

function mergeNumberListIntoUniqueList(listOne, listTwo) \{

return \[…new Set(\[…listOne, …listTwo\])\]

\}

复制代码

上面的命名并不糟糕，但是还不是很友好。你可以将一个功能函数拆分为两个功能函数，这样命名更友好和函数复用性更好。

function mergeLists(listOne, listTwo) \{

return \[…listOne, …listTwo\]

\}

function createUniqueList(list) \{

return \[…new Set(list)\]

\}

复制代码

2、IF语句简化

假设我们有下面的代码：

if(value === ‘duck’ || value === ‘dog’ || value === ‘cat’) \{

// …

\}

复制代码

我们可以这样解决：

const options = \[‘duck’, ‘dog’, ‘cat’\];

if (options[.][]includes(value)) \{

// …

\}

复制代码

将乱七八糟的条件判断放到一个变量中存储，比看臃肿的表达式要好很多。

3、及早返回

有下面的代码：

function handleEvent(event) \{

if (event) \{

const target = event.target;

if (target) \{

// Your awesome piece of code that uses target

\}

\}

\}

复制代码

及早返回使得我们的代码更加易读：

function handleEvent(event) \{

if (!event || !event.target) \{

return;

\}

// Your awesome piece of code that uses target

\}

复制代码

4、解构赋值

在javascript中，我们可以对objects和arrays进行解构赋值。

例如：

// object 解构赋值

const numbers = \{one: 1, two: 2\};

const \{one, two\} = numbers;

console.log(one); // 1

console.log(two); // 2

// array 解构赋值

const numbers = \[1, 2, 3, 4, 5\];

const \[one, two\] = numbers;

console.log(one); // 1

console.log(two); // 2

复制代码

5、童子军规则

童子军有一条规则：永远保持离开时的露营比你发现它时更整洁。如果你在地面上发现了脏东西，那么无论是否是你留下的，你都要将它清理干净。你要有意地为下一组露营者改善环境。

我们编写代码也是这样子，如果你在代码中发现了脏代码，那么你可以尝试去修改它，即使是一个没有被引用到的变量名。

6、代码风格

在你的团队中使用一种代码风格，比如限定代码缩进的规范是两空格呢还是四空格;使用单引号呢还是双引号呢;使用同类的一种框架呢，还是流行两种解决方案的框架呢…这样团队中人员接手项目的成本就会降低，开发人员的心里减少排斥感~

[.]: http://www.0755lawyer.net.cn/feiyong/index_1.html

发表评论取消回复

表情：

评论列表（有 0 条评论，154人围观）

还没有评论，来说两句吧...

相关阅读

相关详解 ESLint 规则，规范你的代码

在很久之前就想通过工具来规范自己的代码风格，减少程序出错的概率，如果看过我的 [一个前端程序猿的Sublime Text3的自我修养][Sublime Text3] ，这篇博客

川长思鸟来/ 2023年07月18日 15:29/ 0 赞/ 45 阅读

相关详解 ESLint 规则，规范你的代码

详解 ESLint 规则，规范你的代码在很久之前就想通过工具来规范自己的代码风格，减少程序出错的概率，如果看过我的 [一个前端程序猿的Sublime Text3的自我修

小鱼儿/ 2023年06月30日 08:58/ 0 赞/ 47 阅读

相关 1661帮助 Jimmy

总时间限制: 1000ms 内存限制: 65536kB 描述 “Help Jimmy” 是在下图所示的场景上完成的游戏。场景中包括多个长度和高度各不相同的平台。地面

ゝ一世哀愁。/ 2023年05月22日 10:23/ 0 赞/ 15 阅读

相关 6 个提高 React 代码质量的方法 - 让你的 React 代码更简洁

![f5e5f265bdf34f30c01a81e64e32cecc.png][] 简洁的代码具有更好的可读性，容易理解，且易于组织。本篇文章介绍 6 个在 React

阳光穿透心脏的1/2处/ 2023年01月18日 14:22/ 0 赞/ 48 阅读

相关从6个方面净化你的Js代码

![format_png][] 记录一下怎样写出整洁规范的代码，用于共勉进步。对于什么是整洁的代码，书中给出了大师们的总结： Bjarne Stroustrup

妖狐艹你老母/ 2022年12月24日 00:47/ 0 赞/ 163 阅读

相关 Jimmy:6个规则去净化你的代码

可读性代码就是可维护性代码! 1、注重命名为一个事件命名是很困难的。虽然困难但是非常有必要。想象以下，将两个数组合并成一个数组，并生成一个唯一值的数组。那么你会怎么命

妖狐艹你老母/ 2022年12月22日 14:28/ 0 赞/ 155 阅读

相关净化心灵

老君曰：大道无形，生育天地；大道无情，运行日月；大道无名，长养万物；吾不知其名，强名曰道。夫道者：有清有浊，有动有静；天清地浊，天动地静。男清女浊，男动女静。降本流末，而生万物

亦凉/ 2022年09月28日 13:06/ 0 赞/ 160 阅读

相关 Help Jimmy（DP）

Description “Help Jimmy” 是在下图所示的场景上完成的游戏。 ![这里写图片描述][SouthEast] 场景中包括多个长度和高度各不相同的平台。

清疚/ 2022年06月09日 09:39/ 0 赞/ 184 阅读

相关 Help Jimmy

Description “Help Jimmy” 是在下图所示的场景上完成的游戏。场景中包括多个长度和高度各不相同的平台。地面是最低的平台，高度为零，长度无限。

朴灿烈づ我的快乐病毒、/ 2022年04月13日 09:28/ 0 赞/ 229 阅读

相关详解 ESLint 规则，规范你的代码

在很久之前就想通过工具来规范自己的代码风格，减少程序出错的概率，如果看过我的 [一个前端程序猿的Sublime Text3的自我修养][Sublime Text3] ，这篇博客

亦凉/ 2022年02月26日 21:14/ 0 赞/ 329 阅读