我用来保持代码可读性的 7 种模式

原文地址：https://javascript.plainenglish.io/7-patterns-i-use-to-keep-code-readable-50b7791ffeaa

原文作者： Babar saad

刚开始写 JavaScript 的时候，我总想显得自己很聪明。单行代码、三元表达式连写、层层嵌套的数组方法，在我的代码里随处可见。那时候看起来很高级，但六个月后，我连自己写的代码都看不懂了。

这几年下来，我逐渐明白：最好的 JavaScript，是未来的自己也不会讨厌的那种。下面是我每天都会用到的 7 个模式，用来让 JS 更可读、更好维护，也更适合团队协作。

1. 优先使用 map + filter，而不是复杂循环

不要把一堆条件塞进一个 for 循环里，而是拆成更小的步骤：

// Oldlet results = [];for (let i = 0; i < users.length; i++) {  if (users[i].active) {    results.push(users[i].email.toLowerCase());  }}// Cleanerconst results = users  .filter(u => u.active)  .map(u => u.email.toLowerCase());

每一步只做一件事 —— 更容易扫一眼看懂，也更容易调试。

2. 提前 return，胜过层层嵌套的 if

我以前经常写那种“金字塔结构”的 if-else。现在我更倾向于直接短路返回：

function processOrder(order) {  if (!order) return;  if (!order.paid) return;  ship(order);}

每一个校验条件都尽早退出，让核心逻辑保持扁平、清晰。

3. 使用 Object.fromEntries 和 Object.entries

以前做对象转换总是很别扭，现在就顺多了：

const settings = { dark: true, beta: false, ads: false };const enabled = Object.fromEntries(  Object.entries(settings).filter(([k, v]) => v));console.log(enabled); // { dark: true }

不依赖第三方库，也能写出可读性很强的对象转换逻辑。

4. 给回调函数起名字

到处都是匿名 arrow function，会让调试变得很痛苦。给它们命名：

function logUser(user) {  console.log(user.name);}users.forEach(logUser);

调用栈更清晰，代码本身也更有“叙事感”。

5. 用模板字符串提升可读性

字符串拼接一直都很丑。模板字符串读起来就像自然语言：

const msg = `Welcome back, ${user.name}. You have ${inbox.length} messages.`;

虽然只是个小改动，但能让代码像文字一样顺畅。

6. 把相关的配置集中管理

与其把常量零散地丢在各个文件里，不如集中起来：

const API = {  BASE: '/api/v1',  USERS: '/api/v1/users',  POSTS: '/api/v1/posts'};

所有接口路径一目了然，未来的我只想说一句：谢谢。

7. 始终使用 async/await + try/catch

我尽量避免把 .then 链和 await 混在一起。可读性永远比简短更重要：

try {  const res = await fetch('/api/data');  const data = await res.json();  console.log(data);} catch (err) {  console.error('Fetch failed:', err);}

写法像同步代码，但实际是异步执行 —— 两全其美。

为什么可读性在长期更重要

为“人”写 JavaScript，并不是在降低代码水平，而是在清晰地表达意图。我希望任何人（包括未来的我）扫一眼代码，就能知道它在干什么。

在 2025 年，区分初级和高级 JavaScript 开发者的，不是语法技巧。而是那种一眼就能看懂的代码书写自律。