实习经历复盘

如何写出工程化、可维护的代码?

开发的第一步:编写TS类型
数据分类:

  • 接口请求数据
  • 接口响应数据
  • 页面数据:UI数据;临时状态数据。

判断一个数据是否值得存入redux时,需要考虑两个问题:

  • 这个数据是否需要被非父子关系的组件共享。需要共享的数据,才值得放入redux。
  • 这个数据是否能从redux已有的数据中计算出来。如果能从已有数据计算得出,就不要增加新的数据,而是使用状态管理工具的计算方法计算得出。以保持状态树的结构简洁无冗余,保证数据更新不易出错。

使用自定义hook拆分大块逻辑:
模块化的目标是分治和复用。尽管业务工程中的组件复用的概率很低,但是分而治之以保证逻辑清晰易读也十分重要。
将一个冗长的组件拆分成若干个小组件,将一段冗长的逻辑拆分为hooks,都是前端CRUD的有效分治手段。

美观也是代码质量的一部分:
如果说人对衣着美观的基本要求是干净,那么对代码的基本要求应该是没有eslint警告、没有拼写错误。这些很容易做到,尤其是现代ide已经做的非常好,帮你提示了一切问题。对于变量的命名也需要语义化,提高可读性。

经验总结

多f12打开控制台调试
对于一份prd,可以通过拆解的方式明确前端具体要做的是什么,关注点分离:后端提供数据、处理业务逻辑;前端接收数据、处理渲染逻辑。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值