业务代码重构

Posted 2020-12-31 windseek

最近接手了一个新的产品，在原有的基础上进行改造。

刚拿到这个产品的代码时，我也是一头雾水，动就上千行的逻辑代码，看的让人很费劲，完全没有任何套路可言，一撸到底的代码，拿到后，我就先把代码拆开，一块一块的看

 

最初只有createorder.js，拆开后变成了4个，createordervalidate.js，createorderutils.js，createorderinit.js，拆过之后，代码分工就比较清晰了，初始化的时候，会加载很多控件，会定义很多全局变量，utils里是一些工具函数，获取表单数据，set表单数据，cookies的获取，url里参数的获取，validate就是表单的校验了，我把表单的提交也放在了这一块。

重构过之后，编辑，新增订单可以公用一套代码，直接调用对应的方法就行了，即使增加一个查看框，也用不了太久就能搞定，之前的方式就是代码copy，没有抽出业务公共的逻辑。

jquery系列的老的产品代码，最好的重构方法就是插件化，现代三大框架，vue，react，angular，就是组件化，加上，数据状态管理器搞定。