重构就是在原来的基础之上,增强代码的可读性和逻辑性,同时还要考虑代码的执行效率。重构之后要尽量做到一个函数只实现一个功能,这样在以后出现某一个功能的错误时,只修改相应的方法就可以,而不影响其他功能的实现。
重构要注意:
1 小块修改,并且修改之后不影响每一个功能
2 每个函数尽量只完成一个功能,且函数不能写的过长,不易理解
3 在controller里不做对数据的存取和处理,将这些关于数据的处理都在model里实现
4 controller中对页面的控制要逻辑清楚,通过调用函数来实现对页面的控制
1 在model里引入prototype可以给创建的对象继承一个方法
实例:
function Activity(activity, status) { this.activity = activity; this.status = status; } Activity.prototype.save_activity = function (activity) { var activities = JSON.parse(localStorage.getItem('activities')) || []; activities.unshift(activity); localStorage.setItem('activities', JSON.stringify(activities)); }
使用时直接new一个新的对象
var activity = new Activity($scope.input_name, "un_start");
然后使用这个对象的方法就可以了
activity.save_activity(activity);
2 在一个函数需要用到两次的时候最好给函数传递一个参数,这样就可以实现一个函数多次使用。
实例:
Activity.change_status = function (status) { var activities = JSON.parse(localStorage.getItem('activities')) || []; var activity = _.find(activities, function (activity) { return activity.activity == localStorage.current_activity; }) activity.status = status; localStorage.setItem('activities', JSON.stringify(activities)); }
调用Activity.change_status("start"),就可以将活动的状态改为start状态
调用Activity.change_status("end"),就可以将活动的状态改为end状态
3 对于一些for循环,可以用underscore代替,可能提高代码的执行效率。
实例:
for 循环
for(var i=0 ; i < activities.length ; i += 1){
if(activities[i].activity==localStorage.current_activity){
/......../
}
}
可以用下面的underscore来代替
var activity= _.find(Activity.get_activities(), function (activity) {
return activity.activity == localStorage.current_activity
}
用for循环会遍历数组中的每一个值,用_.find代替之后,只要找到符合条件的值,就会停止,在有些情况下会大大提高代码的执行效率。
4 对于一些if语句,可以用hash函数法来代替 ,可以使代码的逻辑更加清晰。
实例:
包含if的函数 function button_status() { var current_bid = Bid.current_bid(); if (current_bid.status == "start") { $scope.which_button = "end"; } if (current_bid.status == "end") { $scope.which_button = "un_click_end"; $scope.disabled_end = true; } if (current_bid.status == "un_start") { judge_is_start_bid_activity(); } } 用hash来代替if: var bid_status = { 'start': function () { $scope.which_button = "end"; }, 'end': function () { $scope.which_button = "un_click_end"; $scope.disabled_end = true; }, 'un_start': function () { judge_is_start_bid_activity(); } } bid_status[Bid.current_bid().status]();