代碼重構(gòu)

trigkit4 發(fā)布于2019-08-20 16:44 / 2121人閱讀

摘要：引言列舉一些編碼過程中重構(gòu)的目標雖然不難理解但確實蠻實用的平時編碼中有些經(jīng)常遇到。說明第一種方式通過設置的方式代碼不易讀而重構(gòu)后的代碼簡介明了。

引言

列舉一些編碼過程中重構(gòu)的目標,雖然不難理解,但確實蠻實用的,平時編碼中有些經(jīng)常遇到。

用return 退出多重循環(huán)

常見的就是二重for循環(huán)標記break退出。

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

        }
        if(flag==true){
            break;
        }
    }
}



let func=function () {
    let flag=false;
    for(let i=0;i<100;i++){
        for(let j=0;j<100;j++){
            if(i*j>30){
                return;
            }

        }
    }
}

說明第一種方式通過設置flag的方式,代碼不易讀,而重構(gòu)后的代碼簡介明了。其次如果return后還要一些邏輯要執(zhí)行,可以把要執(zhí)行的邏輯封裝成函數(shù)放到return后面。

大型類的分解

let Attack=function (hero) {
    this.hero=hero;
}
Attack.prototype.start=function (type) {
    return this.list[type].call(this);
}
Attack.prototype.list={
    q:function () {
        console.log("q skill")
    },
    w:function () {
        console.log("w skill")
    }
};

let Hero=function (name) {
    this.name=name;
    this.attackObj=new Attack(this);
}
Hero.prototype.attack=function (type) {
    this.attackObj.start(type);
}
let gaiLunIns=new Hero("GaiLun");
gaiLunIns.attack("q");

說明函數(shù)式編程中我們會將復雜邏輯拆成一個個可處理的最小單元,而在面向?qū)ο笾泻侠砝迷O計模式,可以極大的解耦我們的代碼,
上述實例中,攻擊功能比較復雜,多帶帶封裝成一個類,技能維護成一個列表,拓展性強,整個攻擊邏輯不摻和在hero當中,hero顯得也非常精簡。

少用三目運算符

少用并不是說不用,適當?shù)牡胤绞褂?例如下面的判斷條件簡單且清晰

let global=typeof window != "undefined"  ? window:this;

但是如果嵌套很多層,就不提倡,不易閱讀和維護。

減少函數(shù)參數(shù)的數(shù)量

函數(shù)參數(shù)多,就容易給使用者帶來復雜度,合理的編碼,利用一些設計模式,例如典型的策略模式,而不應該保留過多條件在函數(shù)參數(shù)中,
復雜的邏輯內(nèi)部應該封裝起來。還要就是函數(shù)參數(shù)應該用一個對象來傳遞,例如vue,handsontable等等,這些工具實例化時傳遞的都是option對象,
工具內(nèi)部做了一些默認處理,并且我們傳遞的參數(shù)時,也不用關(guān)心順序和個數(shù)。

函數(shù)提煉

let getPrice=function (price) {
    var date=new Date();
    if(date.getMonth()>=6&&date.getMonth()<=9){
            return price*0.8
    }
}
let isSummer=function () {
    let date=new Date();
    return date.getMonth()>=6&&date.getMonth()<=9
}

let getPrice=function (price) {
    var date=new Date();
    if(isSummer()){
        return price*0.8
    }
    return price;
}

說明復雜的條件語句增加維護難度,不易閱讀,而函數(shù)更能清晰的表達代碼含義,如果命名良好,基本就不用加注釋了。

一等函數(shù)

http.post("/add/article",function(){
…… 
});
http.post("/add/article",callback);

說明上面不傳遞一個具體匿名函數(shù)的好處是,方便解耦和以后不確定增加的維護難度,函數(shù)式編程中一等函數(shù)的應用好處其實有很多。

總結(jié)

設計模式和重構(gòu)行為,都不是必須的,但是這都是一個程序員基本的涵養(yǎng),重構(gòu)有很多方面,我只是列舉了其中幾點,還有一些常見的比如用對象或函數(shù)式封裝變量，模塊化封裝一組功能等等，上面的示例中,有些情況
在平常編碼中不注意也會出現(xiàn)上面的情況,總結(jié)一下,也算是加深一下自己的認知吧。