在javascript开发中，大部分时间都在与函数打交道，所以希望这些函数有着良好的命名，函数体内包含的逻辑清晰明了。如果一个函数过长，不得不加上若干注释才能让这个函数显得易读一些，那这些函数就很有必要进行重构

　　如果在函数中有一段代码可以被独立出来，那最好把这些代码放进另外一个独立的函数中。这是一种很常见的优化工作，这样做的好处主要有以下几点

　　1、避免出现超大函数

　　2、独立出来的函数有助于代码复用

　　3、独立出来的函数更容易被覆写

　　4、独立出来的函数如果拥有一个良好的命名，它本身就起到了注释的作用

　　比如在一个负责取得用户信息的函数里面，还需要打印跟用户信息有关的log，那么打印log的语句就可以被封装在一个独立的函数里：

var getUserInfo = function(){      ajax( 'http:// xxx.com/userInfo', function( data ){          console.log( 'userId: ' + data.userId );          console.log( 'userName: ' + data.userName );          console.log( 'nickName: ' + data.nickName );      });  };  //改成：  var getUserInfo = function(){      ajax( 'http:// xxx.com/userInfo', function( data ){          printDetails( data );      });  };  var printDetails = function( data ){      console.log( 'userId: ' + data.userId );      console.log( 'userName: ' + data.userName );      console.log( 'nickName: ' + data.nickName );  };

【尽量减少参数数量】

　　如果调用一个函数时需要传入多个参数，那这个函数是让人望而生畏的，必须搞清楚这些参数代表的含义，必须小心翼翼地把它们按照顺序传入该函数。在实际开发中，向函数传递参数不可避免，但应该尽量减少函数接收的参数数量。下面举个非常简单的示例。有一个画图函数draw，它现在只能绘制正方形，接收了3个参数，分别是图形的width、heigth以及square：

var draw = function(width,height,square){};

但实际上正方形的面积是可以通过width和height计算出来的，于是我们可以把参数square从draw函数中去掉：

var draw = function( width, height ){      var square = width * height;  };

　　假设以后这个draw函数开始支持绘制圆形，需要把参数width和height换成半径radius，但图形的面积square始终不应该由客户传入，而是应该在draw函数内部，由传入的参数加上一定的规则计算得来。此时，可以使用策略模式，让draw函数成为一个支持绘制多种图形的函数

【传递对象参数代替过长的参数列表】 

　　有时候一个函数有可能接收多个参数，而参数的数量越多，函数就越难理解和使用。使用该函数的人首先得搞明白全部参数的含义，在使用的时候，还要小心翼翼，以免少传了某个参数或者把两个参数搞反了位置。如果想在第3个参数和第4个参数之中增加一个新的参数，就会涉及许多代码的修改，代码如下：

var setUserInfo = function( id, name, address, sex, mobile, qq ){      console.log( 'id= ' + id );      console.log( 'name= ' +name );      console.log( 'address= ' + address );      console.log( 'sex= ' + sex );      console.log( 'mobile= ' + mobile );      console.log( 'qq= ' + qq );  };  setUserInfo( 1314, 'xiaohuochai', 'beijing', 'male', '150********', 121631835 );

这时可以把参数都放入一个对象内，然后把该对象传入setUserInfo函数，setUserInfo函数需要的数据可以自行从该对象里获取。现在不用再关心参数的数量和顺序，只要保证参数对应的key值不变就可以了：

var setUserInfo = function( obj ){          console.log( 'id= ' + obj.id );          console.log( 'name= ' + obj.name );          console.log( 'address= ' + obj.address );          console.log( 'sex= ' + obj.sex );          console.log( 'mobile= ' + obj.mobile );          console.log( 'qq= ' + obj.qq );      };      setUserInfo({          id: 1314,          name: 'xiaohuochai',          address: 'beijing',          sex: 'male',          mobile: '150********',          qq: 121631835      });

原文链接：https://www.qiquanji.com/post/7066.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。