今天为大家整理出了一些关于编写整洁易读代码的小技巧，现在跟大家分享一下

1. 避免没必要的代码嵌套

我们编码的时候经常会做一些繁琐的嵌套，虽然实现了具体的功能也没有出现什么错误，但是代码总体看起来又长又难懂。这时候我们就要用 ”Return Early“的设计模式来精简代码。

比如下面的这段代码，if 语句包含了方法体的所有内容，虽然此段代码没有任何问题，但是这里我们有更清晰的做法。

// not so good
function saveItem(item) {
  if (item != null) {
    if (item.isValid()) {
      item.save();
    }
}

// better
function saveItem(item) {
  if (item == null) return;
  if (!item.isValid) return;
  item.save();
}

两段代码在功能是一样的，但是明显可以看出第二段代码更加整洁易读。

2. 使用对象的解构方法

这里我们有一个参数是 object 类型的函数，它要对接收的 object 进行一系列的操作并且返回一个新的值。在没有使用对象解构的情况下，我们可能会这样编写这段代码。

// not so good
function getFullName(person) {
  const firstName = person.firstName;
  const lastName = person.lastName;
  return `${firstName} ${lastName}`;
}

这段代码功能上没有问题，但不是最精简的写法。下面是使用对象解构之后的代码。

// better
function getFullName(person) {
  const { firstName, lastName } = person;
  return `${firstname} ${lastName}`;
}

当然我们还有更好的做法，直接在函数参数中使用解构方法

// even better
function getFullName({ firstName, lastName }) {
  return `${firstName} ${lastName}`;
}

3. 代码模块化

如果函数只做一件事，它就更易于理解、可读和可维护。如果在编写函数时出现错误，通常更容易找到错误的根源。此外，代码将更具可重用性。

// not so good
function signUpAndValidate() {
// Do a heap of stuff here
}

// better
function signUp() {
}
function validate() {
}

4. 使用合适的参数命名

编码时很容易因为懒惰而使用单字母变量名，这样做只会让自己在日后的维护中更加头疼。这里有一些提示可以在命名上帮到大家

1.函数是执行操作的，所以在命名时使用动词

// bad
function passwordValidation() {
}
// good
function validatePassword() {
}

 2. 在命名 boolean 类型参数时，使用 is 

const isValidPassword = validatePassword("abcd");

 3. 命名 arrays 的时候使用复数

const animal = ["cat", "dog", "bird"];
const animals = ["cat", "dog", "bird"];

 4.  使用回调函数时，迭代中使用有意义的名称

// don't do this
animals.forEach((a) => {
  console.log(a);
});
// do this
animals.forEach((animal) => {
  console.log(animal);
});

5. 不写重复的代码

如果在编码的过程中思考过 “我是不是在多个不同的地方编写过类似的代码？”，那么我们就要考虑是不是应该把它们封装在一个函数里啦。