代码整洁之道(重构)


Posted in Javascript onOctober 25, 2018

前言

之前也介绍过我们团队的前端项目从零开始经历8个月迭代业务代码10万行(仅为产品长期规划需求的20%),至今仍然在不断迭代的过程。

团队成员除了设计好的架构来管理这种复杂度极高的前端应用,还开始补充设计模式以及重构方面的知识,目的是为了让项目代码在不断迭代的过程中优化项目代码,保持代码的新鲜度,鲁棒性,可维护性… 让后续加入的团队新人也可以快速加入我们的产品开发中

PS:  不管对于何种语言,重构都是软件开发过程中不可或缺的一部分。如果已经了解重构的基础,可以直接跳往至文章后面的重构案例部分。

重构背景

“如果尿布臭了,就换掉它”。

  • 随着业务需求的不断加入,代码随着时间的推移变得越来越糟。
  • 这其中可能包括以下坏味道(仅列举):
    • 重复的代码
    • 过长的函数
      • 遵循一条原则: 每当感觉需要注释来说明什么的时候,可以尝试将需要说明的东西写进一个函数中
    • 冗赘类
      • 当子类没有做足够的工作的时候,或者说在可见的预期内,不会有新的情况出现,考虑将类内联化。
    • 过长的类
      • 这种情况容易出现冗余代码。比如如果类内出现了多个变量带有相同的前缀或者后缀,这意味着你可以考虑把他们提炼到某个组件内,或者考虑这个组件是否可以成为子类,使用提炼类的手法来重构。

什么是重构

我们回过头来看一下"什么是重构"

  • 不改变软件可观察行为的前提下,改善其内部结构
  • 以提高理解性和降低修改成本

摘自《重构 - 改善既有代码的设计》(下面简称《重构》)

何时重构?

我们需要明确的一点是: 重构不是一件应该特地拨出一段时间来做的事情。重构不是目的,但是重构可以帮助你把事情做好。

事不过三,三则重构

  • 重复性工作,既有的代码无法帮助你轻松添加新特性时
  • 修补bug时,排查逻辑困难
  • code review 可以让他人来复审代码检查是否具备可读性,可理解性
  • 太多的代码无注释,已然连自己都无法快速理清代码逻辑

重构的衡量指标

  • 数量: 代码的行数
  • 质量: 代码复杂度,耦合度,可读性,架构依赖复杂度等
  • 成本: 花费的时间
  • 回报(成果):  支持后续功能的快速叠加,解决现有因代码设计问题无法优化的矛盾等

抓重点 抓重点啦

说了这么多废话,其实大家都明白没有与实践结合的理论都是空虚的。

但是 重构和 设计模式一样,也是需要一个"学习——领悟——突破"的过程。第一步的学习让你了解基本的重构手法,第二步的实践勾起你对重构手法的回忆以及重温应用,第三步的应用以及实践经验激发你的思考,领悟以及总结,以致于灵活运用。
但凡是人,总是在不断学习,不断温习,以达到具体场景具体应用,灵活自如。

重构是一个很大的话题,《重构》作者本人也是经历了N多的项目,以及多年的经验才总结出来的重构技巧。

重构技巧

《重构》一书作者总结的重构手法实在是太多了,只能通过图片来展示一下所有作者总结的重构列表。
具体的补充,大家可以看看《重构》一书。

代码整洁之道(重构)

代码整洁之道(重构)

重构的实践

作者推荐的一种做法:

  • 随机挑选一个目标 先给自己选择一个目标(譬如“去掉一堆不必要的子类”),然后朝着目标前进,每一步走得小而坚定
  • 没把握就停下来 当你无法证明自己所做的一切能够保证原有程序的逻辑和语义时,请你停下来思考:既有的重构是改善了还是毫无成果需要撤销。
  • 保证每次重构后的测试都能正常跑通

作为开发者, 应当把重构作为开发的一部分,一边开发一边重构。在快速堆叠代码,实现基本需求功能的基础上,写好测试用例,保证功能不变,逐步重构。
这也是我们团队要求每个人都掌握重构这门必备技能的原因。优秀的程序员应当尽量避免低质量的代码。

重构案例

故事场景

有三种类型的电影,顾客可以进行租赁

租赁规则

价格计算规则:

普通片儿 —— 起步价2¥,超过2天的部分每天每部电影收费1.3元
新片儿    —— 每天每部3元
儿童片    —— 起步价2¥,超过3天的部分每天每部电影收费0.8元

积分计算规则:

每借一部电影积分加1,新片每部加2

原始代码

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在线游戏大家来找茬II
Sep 30 Javascript
javascript实现滑动解锁功能
Dec 31 Javascript
常用的Javascript设计模式小结
Dec 09 Javascript
AngularJS入门教程之XHR和依赖注入详解
Aug 18 Javascript
AngularJS ngModel实现指令与输入直接的数据通信
Sep 21 Javascript
AngularJs验证重复密码的方法(两种)
Nov 25 Javascript
jQuery将表单序列化成一个Object对象的实例
Nov 29 Javascript
原生javascript实现分页效果
Apr 21 Javascript
Node.js学习之TCP/IP数据通讯(实例讲解)
Oct 11 Javascript
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
JavaScript实现多态和继承的封装操作示例
Aug 20 Javascript
vue.js 实现a标签href里添加参数
Nov 12 Javascript
Vue使用NPM方式搭建项目
Oct 25 #Javascript
小程序云开发实战小结
Oct 25 #Javascript
vue使用原生js实现滚动页面跟踪导航高亮的示例代码
Oct 25 #Javascript
在Bootstrap开发框架中使用dataTable直接录入表格行数据的方法
Oct 25 #Javascript
浅谈高大上的微信小程序中渲染html内容—技术分享
Oct 25 #Javascript
使用ECharts实现状态区间图
Oct 25 #Javascript
jquery使用FormData实现异步上传文件
Oct 25 #jQuery
You might like
CI(CodeIgniter)框架配置
2014/06/10 PHP
php中动态调用函数的方法
2015/03/16 PHP
php批量删除超链接的实现方法
2015/10/19 PHP
yii2.0实现验证用户名与邮箱功能
2015/12/22 PHP
phpcms中的评论样式修改方法
2016/10/21 PHP
JS及PHP代码编写八大排序算法
2016/07/12 Javascript
js css+html实现简单的日历
2016/07/14 Javascript
jQuery Ajax传值到Servlet出现乱码问题的解决方法
2016/10/09 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
2018/01/18 Javascript
JS声明对象时属性名加引号与不加引号的问题及解决方法
2018/02/16 Javascript
详解Vue 多级组件透传新方法provide/inject
2018/05/09 Javascript
JS字典Dictionary类定义与用法示例
2019/02/01 Javascript
CKEditor 4.4.1 添加代码高亮显示插件功能教程【使用官方推荐Code Snippet插件】
2019/06/14 Javascript
Vue实现PC端靠边悬浮球的代码
2020/05/09 Javascript
微信小程序实现导航栏和内容上下联动功能代码
2020/06/29 Javascript
Python中每次处理一个字符的5种方法
2015/05/21 Python
python kmeans聚类简单介绍和实现代码
2018/02/23 Python
tf.truncated_normal与tf.random_normal的详细用法
2018/03/05 Python
使用pandas对矢量化数据进行替换处理的方法
2018/04/11 Python
一篇文章彻底搞懂Python中可迭代(Iterable)、迭代器(Iterator)与生成器(Generator)的概念
2019/05/13 Python
python实现批量修改服务器密码的方法
2019/08/13 Python
找Python安装目录,设置环境路径以及在命令行运行python脚本实例
2020/03/09 Python
如何使用Python自动生成报表并以邮件发送
2020/10/15 Python
python使用yaml 管理selenium元素的示例
2020/12/01 Python
python 制作本地应用搜索工具
2021/02/27 Python
CSS3自定义滚动条样式 ::webkit-scrollbar的示例代码详解
2020/06/01 HTML / CSS
html+css实现自定义图片上传按钮功能
2019/09/04 HTML / CSS
仿酷狗html5手机音乐播放器主要部分代码
2013/05/15 HTML / CSS
公务员总结性个人自我评价
2013/12/05 职场文书
仓库管理专业个人的自我评价
2013/12/30 职场文书
运动会表扬稿大全
2014/01/16 职场文书
奶茶店创业计划书范文
2014/01/17 职场文书
颐和园导游词400字
2015/01/30 职场文书
我的中国梦主题班会
2015/08/14 职场文书
初三英语教学反思
2016/02/15 职场文书
基于PyQT5制作一个桌面摸鱼工具
2022/02/15 Python