前端、服务端 Code Review 总结

Code Review 总结

前端

环境变量

• 如果存在使用环境变量区分不同业务方 feat 的情况，一定要自行检查好所有和环境变量相关的内容

命名规范

• localStorage 中的 key 最好是统一有辨识度的，如均以品牌名开头

降低冗余，提高代码可读性

• 如 VUE 中能放在计算属性中的尽量不要直接写值，这样容易维护且可读性强
• 不以汉字或 label 进行区分值
• 能放在工具方法中解决的，不在组件中重复写
• 避免 hard code， 尽量以变量的形式展示

逻辑问题

• 检查代码中是否存在有的逻辑非必须但却阻塞渲染的情况，这种情况应该避免
• 一些可能频繁触发的监听器回调上注意节流和防抖，比如 window.resize scroll等

服务端

降低冗余，提高代码可读性

• 较长的变量值可以提取为局部变量，同样改写私有方法的写私有方法

命名规范

• 日志内容要统一，这样排错更容易
• 同一驼峰或下划线，不要混用

普通逻辑

• switch 要有 default
• 多个 promise 可以使用 promise.all
• 逻辑中对于常执行代码，应该注意是否有必要每次都实例化一个类，必要时使用单例
• JSON.parse要 try...catch

排错

• 必要时添加 try…catch 如 JSON.parse()
• 涉及高流量的应用，上线前要压测

捕获错误的位置

🌟🌟🌟🌟🌟How to avoid uncaught async errors in Javascript

未捕获的异步错误

try catch 只能 catch 住 try 体中可能抛出的错误，且只能够捕捉到同步的错误,因此使用 try...catch 的时候需要注意使用的位置：

如上所述不要用 try 包裹异步的操作，（promise 是同步操作），比如 try catch 可以包裹 await， 由于 async 返回的是 promise 所以可以链式调用 .catch，如下

await().catch(e=>{
    throw Error(...)
})

关于错误栈的学习可以参考这篇文章：深入理解 JavaScript Errors 和 Stack Traces

array api 怎么用异步呢？

像 filter every 这种该怎么用呢，当然是不能直接用的，应该转化成如下：

Using async functions with a forEach is usually a bad idea. Instead, use an async map and await Promise.all

await Promise.all([].map(async () => {})
// 根据 map 的结果进行 filter every 的同步调用

数据库使用

• 取全部数据时不把整个 document 取出，只拿需要的字段，避免阻塞