摘要：獨(dú)立出來(lái)的函數(shù)更加容易被改寫，減少維護(hù)成本。例如一個(gè)分頁(yè)函數(shù)，函數(shù)接受一個(gè)表示挑戰(zhàn)頁(yè)碼，在跳轉(zhuǎn)前需要判斷是否在有效的取值范圍。面向?qū)ο笤O(shè)計(jì)鼓勵(lì)將行為分布在合理數(shù)量的更小對(duì)象之中。

這是《 javaScript設(shè)計(jì)模式與開發(fā)實(shí)踐 》一書的最后一章"代碼重構(gòu)"。

以下的一些方法不是必須嚴(yán)格遵守的標(biāo)準(zhǔn)，選擇實(shí)踐哪些，以及如何實(shí)現(xiàn)這都需根據(jù)情況而定(是不是有充足時(shí)間)

如果在函數(shù)中有一段代碼可以獨(dú)立出來(lái)，那么最好把這些代碼放進(jìn)另外一個(gè)獨(dú)立的函數(shù)當(dāng)中去。好處有：

避免出現(xiàn)超大型函數(shù)。

獨(dú)立出來(lái)的函數(shù)有助于代碼復(fù)用。

獨(dú)立出來(lái)的函數(shù)更加容易被改寫，減少維護(hù)成本。

獨(dú)立出來(lái)的函數(shù)如果有一個(gè)良好的命名，本身就起到了注釋的作用。

例如一個(gè)獲取用戶信息的函數(shù)，我們還需要打印用戶信息，這種情況下就可以獨(dú)立出打印信息的代碼。

var getUserInfo = function() {
    ajax("http://xxx/userInfo", function(data) {
        console.log("userId: " + data.userId);
        console.log("userName: " + data.userName);
        console.log("nickName: " + data.nickName);
    });
};

改寫：

var getUserInfo = function() {
    ajax("http://xxx/userInfo", function(data) {
        printUserInfo(data);
    });
};

var printUserInfo = function(data) {
    console.log("userId: " + data.userId);
    console.log("userName: " + data.userName);
    console.log("nickName: " + data.nickName);
};

如果一個(gè)函數(shù)內(nèi)有一些條件語(yǔ)句，而條件語(yǔ)句內(nèi)散布了一些重復(fù)代碼，就有必要進(jìn)行合并去重工作。

例如一個(gè)分頁(yè)函數(shù)paging，函數(shù)接受一個(gè)currpage表示挑戰(zhàn)頁(yè)碼，在跳轉(zhuǎn)前需要判斷currpage是否在有效的取值范圍。

var paging = function(currpage) {
    if (currpage <= 0) {
        currpage = 0;
        jump(currpage); // 跳轉(zhuǎn)
    } else if (currpage >= totalPage) { // 總頁(yè)數(shù)totalPage
        currpage = totalPage;
        jump(currpage); // 跳轉(zhuǎn)
    } else {
        jump(currpage); // 跳轉(zhuǎn)
    }
}

負(fù)責(zé)跳轉(zhuǎn)的jump(currpage)在每個(gè)條件分支都出現(xiàn)了，所以完全把這句代碼獨(dú)立出來(lái):

var paging = function(currpage) {
    if (currpage <= 0) {
        currpage = 0;
    } else if (currpage >= totalPage) { // 總頁(yè)數(shù)totalPage
        currpage = totalPage;
    }

    jump(currpage); // 跳轉(zhuǎn)
}

在程序設(shè)計(jì)中，復(fù)雜的條件語(yǔ)句是導(dǎo)致程序難以閱讀和理解的重要原因，而且容易增大函數(shù)代碼量。例如以一個(gè)計(jì)算商品價(jià)格的getPrice函數(shù)，商品計(jì)算有個(gè)規(guī)則，夏天商品以8折出售。

var getPrice = function(price) {
    var date = new Date;
    if (date.getMonth() >= 6 && date.getMonth() <= 9 ) { // 處于夏天
        return price * 0.8
    }
    return price;
}

其中的條件語(yǔ)句if (date.getMonth() >= 6 && date.getMonth() <= 9 )
如果改寫提煉成一個(gè)獨(dú)立的函數(shù)，既能更準(zhǔn)確的表達(dá)代碼的意思，函數(shù)名又能起到注釋作用。

var isSummer = function() {
    var dateMonth = (new Date).getMonth();
    return dateMonth >= 6 && dateMonth <= 9 ;
};

var getPrice = function(price) {
    var date = new Date;
    if ( isSummer() ) { // 處于夏天
        return price * 0.8
    }
    return price;
};

在函數(shù)體內(nèi)，如果有些代碼是負(fù)責(zé)一些重復(fù)性的工作，那么合理使用循環(huán)不僅可以完成同樣的功能，還可以使代碼量更少，有一段創(chuàng)建XHR對(duì)象的代碼，為了簡(jiǎn)化代碼，只檢測(cè)IE9已下的瀏覽器。

var creatXHR = function() {
    var xhr;
    try{
        xhr = new ActiveXObject("MSXML2.XMLHTTP.6.0");
    } catch(e) {
        try{
            xhr = new ActiveXObject("MSXML2.XMLHTTP.3.0");
        } catch(e) {
            xhr = new ActiveXObject("MSXML2.XMLHTTP");
        }
    }

    return xhr;
};

var xhr = creatXHR();

下面靈活的使用循環(huán)，可以得到上面代碼一樣的效果：

var creatXHR = function() {
    var versions = ["MSXML2.XMLHTTP.6.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP"];
    for (var i = 0;i < versions.length; i++) {
        try{
            return new ActiveObject( version[i] );
        }catch(e) {

        }
    }
};

var xhr = creatXHR();

初學(xué)者可能有這樣一個(gè)觀念：”每個(gè)函數(shù)只能有一個(gè)入口和一個(gè)出口?！爆F(xiàn)代編程語(yǔ)言都會(huì)限制函數(shù)有一個(gè)入口。但是關(guān)于”函數(shù)只有一個(gè)出口”，往往有不一樣的看法。
下面是一個(gè)遵守“函數(shù)只有一個(gè)出口”的代碼。

var del = fucntion(obj) {
    var ret;
    if (!obj.isReadOnly) { // 不為只讀才能刪除
        if (obj.isFolder) { // 判斷文件夾
            ret = deletFolder(obj);
        } else if (obj.isFile) { // 判斷文件
            ret = deletFile(obj);
        }
    }
    return ret;
}

嵌套的條件分支語(yǔ)句是代碼維護(hù)者的噩夢(mèng)，如果對(duì)函數(shù)的剩余部分不感興趣，那就應(yīng)該立即退出。
我們可以挑選一些條件分支，在進(jìn)入這些條件分支后，就立即讓函數(shù)退出。有一個(gè)常見的技巧。在面對(duì)一個(gè)嵌套的if分支時(shí)，我們可以把外層if表達(dá)式進(jìn)行反轉(zhuǎn)。例如：

var del = function(obj) {
    if (obj.isReadOnly) { // 反轉(zhuǎn)表達(dá)式
        return;
    }

    if (obj.isFolder) {
        return deletFolder(obj);
    }

    if (obj.isFile) {
        return deletFile(obj);
    }
}

函數(shù)可能接受多個(gè)參數(shù)，參數(shù)越多函數(shù)就越難理解和使用。

setUserInfo(1111, "sven", "hangzhou", "male", "137*****")

// 可改寫成
setUserInfo({
    id: 1111,
    name: "sven",
    address: "hangzhou",
    sex: "male",
    mobile: "137*****"
})

改寫后可以不再關(guān)心參數(shù)的數(shù)量和順序，一般參數(shù)控制在4個(gè)以內(nèi)，超過(guò)4個(gè)就需要轉(zhuǎn)化成對(duì)象形式。

鏈?zhǔn)秸{(diào)用在調(diào)試的時(shí)候非常不方便，如果一條調(diào)用鏈中有錯(cuò)誤出現(xiàn)，必須要把這條調(diào)用鏈拆開才能定位錯(cuò)誤出現(xiàn)的地方。

如果該鏈條的結(jié)構(gòu)穩(wěn)定，后期不易發(fā)生修改，使用鏈?zhǔn)秸{(diào)用無(wú)可厚非，但是如果該鏈條容易發(fā)生變化，導(dǎo)致調(diào)試和維護(hù)困難，那么普通調(diào)用形式為佳。

如果一個(gè)類的方法足夠復(fù)雜和龐大，那么它完全有必要作為一個(gè)多帶帶的類存在。面向?qū)ο笤O(shè)計(jì)鼓勵(lì)將行為分布在合理數(shù)量的更小對(duì)象之中。

在函數(shù)有兩重循環(huán)語(yǔ)句時(shí)，我們往往需要在內(nèi)層循環(huán)中判斷，當(dāng)達(dá)到臨界條件時(shí)退出外層循環(huán)，有以下實(shí)現(xiàn)方式。

設(shè)置flag。

var func = function() {
    var flage = false;
    for (var i = 0; i < 10; i++) {
      for (var j = 0; j < 10; j++) {
        if (i * j > 30) {
          flag = true;
          break;
        }
      }
      if (flag === true) {
        break;
      }
    }
}

設(shè)置循環(huán)標(biāo)記

var func = function() {
  outerloop:
  for(var i = 0; i < 10; i++) {
    innerloop:
    for(var j = 0; j < 10; j++) {
      if (i * j >30) {
        break outerloop;
      }
    }
  }
}

這兩種做法都讓人頭暈?zāi)垦?，更?jiǎn)單的做法是直接終止整個(gè)方法：

var func = function() {
    for (var i = 0; i < 10; i++) {
      for (var j = 0; j < 10; j++) {
        if (i * j > 30) {
          return;
        }
      }
    }
}

用return直接退出有一個(gè)問(wèn)題，在循環(huán)之后如果還有代碼就無(wú)法執(zhí)行：

var func = function() {
    for (var i = 0; i < 10; i++) {
      for (var j = 0; j < 10; j++) {
        if (i * j > 30) {
          return;
        }
      }
    }
    console.log(i); // 無(wú)法執(zhí)行
}

我們可以把循環(huán)后需要的代碼放到return后面，如果代碼較多，可以提煉成一個(gè)多帶帶的函數(shù)。

var print = function(i) {
  console.log(i);
};
var func = function() {
    for (var i = 0; i < 10; i++) {
      for (var j = 0; j < 10; j++) {
        if (i * j > 30) {
          return print(i);
        }
      }
    }
};