乐趣区

关于javascript:谁不想写出干净的代码7-个技巧让你的同事爱上你的代码

jiezi

前言

原文地址：https://medium.com/javascript… 作者：Amy J. Andrews

你的共事：” 这个代码的作者是谁？”

冀望：” 是我！” 你会骄傲地答复，因为该代码像公主一样漂亮。

事实：” 不，不是我！” 你说谎是因为该代码像野兽一样俊俏。

当初，如果你想让冀望成为事实，请持续浏览。

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 这个单词不应该是函数名的一部分。Add 会导致增加更多的责任到函数中，这从长远看来弊大于利。

上面这种写法是最好的：

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;
  const 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 来放弃丑陋的代码。

这个插件将会节俭你花在格式化代码上的工夫。得益于它，你能够利用这部分工夫将更多的精力放在代码品质上。

❤️ 爱心三连击

通过浏览，如果你感觉有播种的话，能够爱心三连击！！！

退出移动版