看见一个过长的函数或者需要一段注释才能让人理解的代码,可以考虑将这段代码放进一个独立函数中。

创造一个新的函数,根据这个函数的意图来对它命名(以它“做什么”来命名,而不是以它“怎么做”命名)。

需要重构的代码如下(代码并不复杂,只是为了说明方法):

function print () {
var num = 1;
console.log('*****************');
console.log('******Hello******');
console.log('*****************'); while(num < 10){
num += 2;
} console.log('num:', num);
}

示例:

1、无局部变量

可以轻松提炼打印“Hello World”的代码。只需要剪切、粘贴、再插入一个函数调用的动作即可。

function print () {
var num = 1;
printHello();
while(num < 10){
num += 2;
} console.log('num:', num);
} function printHello () {
console.log('*****************');
console.log('******Hello******');
console.log('*****************');
}

2、有局部变量

  • 只读取,并不修改局部变量。此时可以简单地将局部变量作为参数传给目标函数。
function print () {
var num = 1;
printHello();
while(num < 10){
num += 2;
} printNum (num);
} function printHello () {
console.log('*****************');
console.log('******Hello******');
console.log('*****************');
} function printNum (num) {
  console.log('num:', num);
}
  • 对局部变量赋值

  1) 只在被提炼的代码中使用,可以将这个临时变量声明移到被提炼代码中,然后一起提炼出去。(这个很容易理解)

  2) 被提炼代码之后的代码还使用了这个变量,需要在提炼的代码中返回改变后的值。

function print () {
printHello();
var result = getNum();
printNum (result);
} function printHello () {
console.log('*****************');
console.log('******Hello******');
console.log('*****************');
} function getNum () {
var num = 1;
while(num < 10){
num += 2;
}
return num;
} function printNum (result) {
  console.log('num:', result);
}

不断学习,不断进步~~~

《重构-改善既有代码的设计》学习笔记----Extract Method(提炼函数)的更多相关文章

  1. 【转】PHP 杂谈《重构-改善既有代码的设计》之一 重新组织你的函数

    原文地址: PHP 杂谈<重构-改善既有代码的设计>之一 重新组织你的函数 思维导图   点击下图,可以看大图.    介绍   我把我比较喜欢的和比较关注的地方写下来和大家分享.上次我写 ...

  2. 《重构--改善既有代码的设计》总结or读后感:重构是程序员的本能

    此文写得有点晚,记得去年7月读完的这本书,只是那时没有写文章的意识,也无所谓总结了,现在稍微聊一下吧. 想起写这篇感想,还是前几天看了这么一篇文章 研究发现重构软件并不会改善代码质量 先从一个大家都有 ...

  3. 《重构——改善既有代码的设计》【PDF】下载

    <重构--改善既有代码的设计>[PDF]下载链接: https://u253469.ctfile.com/fs/253469-231196358 编辑推荐 重构,一言以蔽之,就是在不改变外 ...

  4. 重构 改善既有代码的设计 (Martin Fowler 著)

    第1章 重构, 第一个案例 1.1 起点 1.2 重构的第一步 1.3 分解并重组 statement() 1.4 运用多态取代与价格相关的条件逻辑 1.5 结语 第2章 重构原则 2.1 何谓重构 ...

  5. 《重构-改善既有代码的设计》学习笔记---Replace Temp with Query(以查询取代临时变量)

    临时变量的问题在于: 它们是暂时的,而且只能在所属函数内使用.由于临时变量只在所属函数内可见,所以,如果很多地方都在用这个临时变量,就会驱使你写出更长的函数.如果把临时变量替换为一个查询,那么其他函数 ...

  6. 『重构--改善既有代码的设计』读书笔记----Extract Method

    在编程中,比较忌讳的一件事情就是长函数.因为长函数代表了你这段代码不能很好的复用以及内部可能出现很多别的地方的重复代码,而且这段长函数内部的处理逻辑你也不能很好的看清楚.因此,今天重构第一个手法就是处 ...

  7. 【重构.改善既有代码的设计】14、总结&读后感

    14.总结 首先,这是一本太老的书,很多观点已经被固化或者过时了.但核心观点没有问题,虽然大多数观点已经被认为是理所当然的事情了.   重构的定义 重构分几种: 1.狭义的代码重构   就是本书讲的, ...

  8. 『重构--改善既有代码的设计』读书笔记---Duplicate Observed Data

    当MVC出现的时候,极大的推动了Model与View分离的潮流.然而对于一些已存在的老系统或者没有维护好的系统,你都会看到当前存在大把的巨大类----将Model,View,Controller都写在 ...

  9. 『重构--改善既有代码的设计』读书笔记----Move Method

    明确函数所在类的位置是很重要的.这样可以避免你的类与别的类有太多耦合.也会让你的类的内聚性变得更加牢固,让你的整个系统变得更加整洁.简单来说,如果在你的程序中,某个类的函数在使用的过程中,更多的是在和 ...

  10. 『重构--改善既有代码的设计』读书笔记----Substitute Algorithm

    重构可以把复杂的东西分解成一个个简单的小块.但有时候,你必须壮士断腕删掉整个算法,用简单的算法来取代,如果你发现做一件事情可以有更清晰的方式,那你完全有理由用更清晰的方式来解决问题.如果你开始使用程序 ...

随机推荐

  1. [Hive安装问题]

    启动Hive时出现: Exception in thread "main" java.lang.RuntimeException: java.lang.IllegalArgumen ...

  2. 【转】Android-Input input&按键布局文件

    https://source.android.com/devices/input 输入 Android 输入子系统名义上是由遍历系统多个层的事件管道组成. 输入管道 在最低层,物理输入设备会生成描述状 ...

  3. makefile笔记6 - makefile条件判断

    使用条件判断,可以让 make 根据运行时的不同情况选择不同的执行分支.条件表达式可以是比较变量的值,或是变量和常量的值. 一.示例 下面的例子,判断\(\$\)(CC)变量是否"gcc&q ...

  4. 2017-10-22模拟赛T2 或(or.*)

    题面 [题目描述]你需要构造一个长度为 n 的数列 X,当中的数字范围从 0 到 2^30-1.除此之外你需要满足 m 个条件,第 i 个条件为 X[li]|X[li+1]|……|X[ri]=pi.| ...

  5. python安装后环境变量的设置

    win7系统中单击右击计算机->属性->高级系统设置->环境变量 在path目录下用分号分开做分割添加环境变量. 如果同时添加python2.x.x版本和python3.x.x版本两 ...

  6. 201771010141 周强 面向对象程序设计(Java)第12周作业

    实验十二  图形程序设计 实验时间 2018-11-14 1.实验目的与要求 (1) 掌握Java GUI中框架创建及属性设置中常用类的API: (2) 掌握Java GUI中2D图形绘制常用类的AP ...

  7. Python帮助

    我们可以很容易的通过Python解释器获取帮助.如果想知道一个对象(object)更多的信息,那么可以调用help(object)!另外还有一些有用的方法,dir(object)会显示该对象的大部分相 ...

  8. php 调用接口

    1.一般常用方法 file_get_contents(): 今天调用了一个反人类的接口,接口是get方式传输,里面有一个参数是当前时间,没错,不是时间戳,是当前格式化的时间:2017-8-9 11:1 ...

  9. 搭建EOS未完

    纯净机器上部署 EOS 测试网 演示的系统为 Ubuntu 18.04 LTS,内存8g以上,硬盘300g+ clone EOS代码 们以EOS-Mainnet仓库部署,(EOS-Mainnet是部署 ...

  10. 面向对象的JavaScript-小结

    Javascript中的类 类是对象的模板,用于创建共享一系列属性和方法的类似对象. 使用new关键字调用函数,可以创建对象实例. function Accommodation(){}; var ho ...