前言
不知道大家有没有感觉， 一到三年工作经验的其实差距还是很大的 ，有的一年工作经验的能力的确比三年的更强点，难不成他们是天生编码能力强？非也！是因为他们会花更多的时间去学习去思考。
其中个人觉得 code Review 和 学习优秀的开源项目 会让你的编码能力提升的非常快..
仔细来说说 code Review 的好处吧:
- 多人一起review 你的代码的时候 会迸发出更多 想法 让你知道 你又哪些方面没有考虑到
- Review 水平比你高的 你可以在他的编码习惯中学习到 很多思路与设计
- Review 水平比你低的 你可以看看那些错误是怎么发生的 从而以后去避免他
- Review 和自己差不多的 你可以换位思考 看看自己和他的 实现方式的区别
分享一下我们Review 的代码
下面代码都是 伪代码 ，请勿较劲，并且每一家公司有自己的 规范与习惯 如果和你们的习惯不一样 ，那就是你们对 仅供参考~
1、对于只有一个 if else 并且简单赋值可以用三元表达式优化
修改之前：
优化后：
对于 不变的并且结构很长的这种对象或数组，可以放到一个 ts 文件，通过引入的方式，这样代码看起来会代码更简洁明了
2、用map 映射 替换重复判断的 if else
修改之前：
优化后：
对于重复的 if else 判断，可以用map 结构去优化，这种也是设计模式中的 策略模式 ，这样就会避免代码中大量的 if else 让人看代码的时候头疼
3、将forEach+splice的方式 替换成findIndex+splice
修改之前：
优化之后：
每次写代码的时候不应该只会使用 forEach, 这个场景就 通过 findIndex 直接找到索引, 删除那一项 这样不会像 修改之前那样 每次都要遍历完数组 复杂度会大大降低
4、将判断提前
修改之前：
修改之后
将判断提前,就不用if里面包裹大量逻辑,并且优化性能,当 dataNum 不存在的时候 就不会执行下面的代码了
5、太多重复的对象代码 可以用解构的方式
修之前：
修改之后：
params 参数就是 应用于 form 没必要一个个的赋值过去 可以 可以用 ... 的方式
6、对于大量的 重复类型可以用 Pick、Partial、Omit 等ts 的内置类型 对 一个类型去做 类型提取
修改之前：
修改之后：
这样的的话 尽可能就是对一个大的类型进行收敛 而不是分散的 各种重复的类型
7、避免使用 魔法数字 可使用一个常量 或者枚举去替代
修改之前：
修改之后:
将 魔法数字 120 改成一个常量 加上注释 这样会 清晰很多
8、尽量少的造轮子
修改之前：
修改之后：
这里逻辑是关闭elemnet 之外的 弹框 其实没必要自己手写这种逻辑 而且写不好还有可能有一些奇怪的bug 在vue3 中比较广泛使用的自定义hooks就是 vueuse 大家可以多看看 这种库 不仅提高开发效率 还有利于学习如何编写自定义hooks
总结
如果你是一个刚入行 并且公司只有你一个前端 其实个人觉得 会很难养成一个好的编码习惯 因为没有可以参考的地方，这种情况公司没有大佬 也没有机会组织code Review 那你就可以多看看开源项目 比如 vue3 的 elemnet-plus 、vben、vue3-admin-vite等等，如果你公司有 code Review 的活动请牢牢抓紧它 因为你可以从中获益匪浅！