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

14次阅读

共计 2782 个字符,预计需要花费 7 分钟才能阅读完成。

前言

原文地址: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;

对于回调函数,不要偷懒,只是命名变量为一个字母,例如 hjd(可能即使是你,这些命名的客人,都不晓得它们是什么意思)。长话短说,如果变量是集体 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 来放弃丑陋的代码。

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

❤️ 爱心三连击

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

正文完
 0