谁不想写出干净的代码?

你的同事:"这个代码的作者是谁?"

期望:"是我!" 你会自豪地回答,因为该代码像公主一样美丽。

现实:"不,不是我!" 你说谎是因为该代码像野兽一样丑陋。

现在,如果你想让期望成为现实,请继续阅读。

1 . 使用有意义的变量命名

使用有意义的名称,这会让你一眼就知道是什么意思。

// 不推荐
let xyz = validate(‘amyjandrews’);
// 推荐
let isUsernameValid = validate(‘amyjandrews’);

将集合类型命名为复数是有意义的。因此,不要忘记s

// 不推荐
let number = [3, 5, 2, 1, 6];
// 推荐
let numbers = [3, 5, 2, 1, 6];
复制代码

描述函数做的事。所以,一个函数的命名应该是个动词

// 不推荐
function usernameValidation(username) {}
// 推荐
function validateUsername(username) {}

对于boolean类型的命名需要以is 作为开始。

let isValidName = validateName(‘amyjandrews’);

不要直接使用常量,因为随着时间的推移,你可能会这样:"这 TM 是什么?"。最好的是在使用之前命名好需要的常量。

// 不推荐
let area = 5 * 5 * 3.14;
// 推荐
const PI = 3.14;
let radius = 5;
let area = PI * radius * radius;

对于回调函数,不要偷懒,只是命名变量为一个字母,例如 h、j、d(可能即便是你,这些命名的主人,都不知道它们是什么意思)。长话短说,如果变量是个人 person,传个person;如果是本书 book,传个book

// 不推荐
let books = [‘Learn JavaScript’, ‘Coding for Beginners’, ‘CSS the Good Parts’];
books.forEach(function(b) {
  // …
});
// 推荐
let books = [‘Learn JavaScript’, ‘Coding for Beginners’, ‘CSS the Good Parts’];
books.filter(function(book) {
  // …
});

2 . 抛出信息丰富的异常

"An error occurs."

或者只是:Error.
每当我在某些app或网站中看到这样的错误,如果我作为用户,我会讨厌它。我做的什么是错误的?是我导致的这个错误?那么错误是什么?
你并没有告诉我,接下来我应该怎么做?
你的用户可能会和我有同样的感受,有时他们将会卸载你的 app
并不会再安装。其实,写一个清楚的错误消息不是很难的事。

如果此时没有连接网络,则:

showMessage(‘No internet connection! Please check your connection and try again!’);

如果用户忘记输入信息,则:

showMessage(‘Please enter your username’);

更重要的是,一个清楚的错误可以帮助你快速定位 bug,并且节省你很多开发的时间。

if (error) {
  throw new Error(‘validation.js:checkUser: special characters are now allowed’);
}

以上这些就是你可以参考的错误消息格式。

3 尽可能早地 return

请看下面这段代码:

function login(username, password) {
  if (isValid(username)) {
    // Log in
  } else {
    showMessage(‘Username is not valid’);
  }
}

其实,这里 else 的部分是不需要的。我们应该通过尽早返回一个信息来移除它:

function login(username, password) {
  if (!isValid(username)) {
    showMessage(‘Username is not valid’);
    return;
  }
  // Log in
}

这会让你的代码变得更加清晰。边缘条件应该放在较早的位置,然后再放置较长的部分,它要处理更多的逻辑。

4 不要一个函数太多的权利

每个函数应该只承担一项责任。不要出现一个强大的函数做太多事情况。

function validateAndLogin() {
  // Do a lot of things here
}

and这个单词不应该是函数名的一部分。And会导致添加更多的责任到函数中,这从长远看来弊大于利。

下面这种写法是最好的:

function validate() {
  // Only validate
}
function login() {
  // Only login
}

5 避免副作用

在函数外的任何东西都不是它的业务。所以,函数不应该接触到它们中的任何一个。

例如:

var number = 3;
function changeNumber(add) {
  number = 2 + add;
  return number;
}
changeNumber();

当你调用一个改变number的函数,number变量的值将会被改为 6。这是个真实存在的问题,因为有时你对改变了全局变量一无感知。所以,你应该在你的项目避免产生副作用。

那要怎么做?通过使用纯函数。

上面这个例子可以改成这样:

function addThree(summand) {
  const CONSTANT = 3;
  let sum = summand + CONSTANT;
  return sum;
}

6 创建模块

当你创建一些函数。它们似乎在做类似的动作。例如,验证用户名和验证密码。那么,你会感觉到它们可以分到一个模块中。这里我们称之为验证模块。

const validateUsername = function (username) {
  // Validate username
};
const validatePassword = function (password) {
  // Validate password
};
Module.exports = {
  validateUsername,
  validatePassword
};
const { 
  validateUsername,
  validatePassword
} = require(‘./validation’);
let isUsernameValid = validateUsername(‘amyjandrews’);

7 使用代码格式化插件

我大多数的项目都是用 VSCode 开发的,如果你也在使用VSCode,请确认安装了Prettier来保持漂亮的代码。

这个插件将会节省你花在格式化代码上的时间。得益于它,你可以利用这部分时间将更多的精力放在代码质量上。

链接:https://juejin.im/post/6887184781008715789

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,928评论 6 509
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,748评论 3 396
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 166,282评论 0 357
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,065评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,101评论 6 395
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,855评论 1 308
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,521评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,414评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,931评论 1 319
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,053评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,191评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,873评论 5 347
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,529评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,074评论 0 23
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,188评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,491评论 3 375
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,173评论 2 357

推荐阅读更多精彩内容