小目标

  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::

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

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

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

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);
}

 

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

 

posted on 2018-01-29 21:51  自信哥  阅读(145)  评论(0编辑  收藏  举报