持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第1天，点击查看活动详情
前言
初学者学习代码风格主要是通过模仿，所以我们需要看书，看视频来学习其他人的代码？一旦度过初级阶段，你就会开始追求自己的代码风格，追求高效简洁的代码风格！
不过请记住：纯粹地追求高效简洁会降低代码的可读性，编写出可读性强的代码更重要。
多年来，我从日常的开发中以及开源项目中，总结出一些经验，整理成本文，与您分享，愿能对你有所启发！！！
1. 避免不必要的嵌套
if在日常的编码中是经常出现的！我们也会使用各种各样的嵌套代码。嵌套本身是没什么问题的，但是嵌套有些时候会让我们的代码难阅读！针对这种情况，我们可以使用提前return来优化代码。我们使用if语句来提前检查并进行return！
假设我们有一个函数，其中 if 语句包装了整个函数：
function deleteItem(item) {
if (item != null) {
console.log("Deleting item");
item.delete();
}
}
复制代码虽然这基本上没有什么问题，但我们可以通过使用保护子句使其更清晰。因此，我们不检查项目是否不为空，而是对此求反，如果项目为空，则不返回任何内容：
function deleteItem(item) {
if (item == null) return;
console.log("Deleting item");
item.delete();
}
复制代码两种实现的行为相同，但正如所见，第二种实现显然更干净。
现在让我们看一个嵌套 if 语句的示例：
function saveItem(item) {
if (item != null) {
console.log("Validating");
if (item.isValid()) {
console.log("Saving item");
item.save();
}
}
复制代码同样，这个实现并没有什么问题，但是我们可以改变我们使用 if 语句的方式来完全删除这个函数的嵌套：
function saveItem(item) {
if (item == null) return;
console.log("Validating");
if (!item.isValid) return;
console.log("Saving item");
item.save();
}
复制代码2.对函数参数使用对象解构
假设我们有一个函数，它接受一个对象作为参数，并对该对象执行某种操作以返回一个新值。如果不使用对象解构，我们可能会得到这样的结果：
function getFullName(person) {
const firstName = person.firstName;
const lastName = person.lastName;
return `${firstName} ${lastName}`;
}
复制代码这个函数中，我们创建了两个临时变量firstName和lastName
实现这一点的更好方法是使用对象解构。我们可以解构 person 对象在一行中获取名字和姓氏：
function getFullName(person) {
const { firstName, lastName } = person;
return `${firstname} ${lastName}`;
}
复制代码我们可以通过直接解构参数来更进一步简化代码。
// even better
function getFullName({ firstName, lastName }) {
return `${firstName} ${lastName}`;
}
复制代码3. 使用纯函数避免副作用
编写函数时，最好避免修改该函数之外的任何变量。
let items = 5;
function changeNumber(number) {
items = number + 3;
return items;
}
changeNumber(5);
复制代码在这里，每当我们调用这个函数时，它都会修改items，我们最好避免这样修改变量。我们要避免的另一件事是依赖函数中的外部变量。如果items变量突然不存在或改变了它的数据类型，显然会导致我们想要避免的问题。
因此，相反，使用纯函数，我们可以将函数重写为以下内容：
function addThree(number) {
return number + 3;
}
复制代码这里我们去掉了外部变量的依赖，让函数返回一个新值。它的功能现在是完全独立的，因此它的行为现在是完全可预测的。
4. 保持功能简单
在编写函数时，将多个东西放在一个地方可能很诱人：
function signUpAndValidate() {
}
复制代码但这会很快导致意大利面条式代码和不需要的错误。最好让功能只对一件事负责。
function signUp() {
}
function validate() {
}
复制代码5. 始终使用有意义的变量名
编码时很容易变得懒惰并有时使用单字母变量名，但这只会让您头疼。这里有一些提示可以帮助您。
-
函数执行动作，因此在命名时使用动词。
// bad function passwordValidation() { } // good function validatePassword() { } 复制代码 -
使用is在使用布尔类型时：
const isValidPassword = validatePassword("abcd"); 复制代码 -
对数组使用复数：
const animal = ["cat", "dog", "bird"]; const animals = ["cat", "dog", "bird"]; 复制代码 -
使用回调函数迭代时始终使用有意义的变量名：
animals.forEach((a) => { console.log(a); }); animals.forEach((animal) => { console.log(animal); }); 复制代码