代碼重構

重構就是在不改變軟件現有功能的基礎上,通過調整程序代碼改善軟件的質量、性能,使其程序的設計模式和架構更趨合理,提高軟件的擴展性和維護性。

重構的注重點:

1.重構一步就測試一步,保證程序不會出現錯誤。

2.每個函數只實現一個功能,分的越細,代碼複用率越高

3.函數名符合規範,見名知意。

4.controller中只寫調用功能方法實現對view控制

5.用underscore替代各種循環。

 

重構實例:

 我做的是一個有關報名競價的應用,其中涉及到通過短信報名相關活動,報過名的的人可以參加後面的競價,其中涉及到短信提取和存儲。下面的messages就是用來存儲報名信息的數組,activities爲存儲的活動和信息。

1.數組定義

之前定義數組:

 

var messages = JSON.parse(localStorage.getItem('messages')) || [];

 重構後:

 

 

Sms.get_messages = function(){
    return JSON.parse(localStorage.getItem('messages')) || [];
}

 通過return將這個數組的值返回給函數名Sms.get_messages();所以Sms.get_messages()就代表這個數組,可以通過調用它來實現數組的獲取。

 

2.函數間可以相互調用

重構前:

 

    var messages = JSON.parse(localStorage.getItem('messages')) || []
        for (var i = 0;i <messages.length; i +=1 ){
            if(messages[i].phone == Sms.sign_up_phone(json_message) ){
                localStorage.current_phone = messages[i].phone;
            }
        }

這樣就將對應的電話存儲到本地庫中,存儲的類型是字符串型數據。 

 

 由於for循環再嵌套上if很容易出現邏輯錯誤,所以將for循環改成underscore中的_.find方法。_.find方法替代for循環,根據return中的判斷條件尋找數組中的符合條件的數據,messages代表要遍歷的數組,function中的message就相當與前面的messages,只是爲了理解方便。這樣就可以理解爲在messages中遍歷每一個message。

 

與之對應的_.find方法

var messages = JSON.parse(localStorage.getItem('messages')) || [];
Sms.is_same_sign_message = function(json_message){
    return _.find(messages,
        function (message) {
            return message.phone ==  Sms.sign_up_phone(json_message)
        })
}

 重構後:

 

 

Sms.is_same_sign_message = function(json_message){
    return _.find(Sms.get_messages(),
        function (message) {
            return message.phone ==  Sms.sign_up_phone(json_message)
        })
}

 這個函數中messages用Sms.get_messages()代替,其他用到這個數組的函數也可通過Sms.get_messages()調用來實現代碼複用。

3.underscore用法

之前用for循環來來存儲messages中與localStorage.activities_sign相同的元素,如果判斷條件增加會使代碼過於龐大而且邏輯複雜

 

for(var i=0;i<messages.length;i++){
         if(messages[i].status == localStorage.current_status){
                 localStorage.current = messages[i];
         }
}

 重構後:

Activity.is_current_name = function(){
      return _.find(messages,function(message){
               return message.status == localStorage.current_status
     })
}

 _.find後的messages是要處理的數組名,function(message)中的message代表messages中的每個元素,相當於messages,function(message){}函數體中的return後是判斷條件。_.find是查找messages中符合判斷條件的元素,而且是查找到第一個符合條件的內容就返回而不再向下執行。_.filter是查找所有符合條件的元素並存儲,若要取此數組只需調用此方法名。

提供一個學習underscore的網站:http://www.css88.com/doc/underscore/;

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章