正文:
重构的目的就是使代码更加简单,更易读懂.重构就是在原来代码的基础上进行改进,减少函数内圈复杂度,不会改变代码要实现的功能,有时,重构后的代码量比之前更大了,但代码的结构也更清晰了.
一. 原代码重构的主要方面:
1.在逻辑控制方面用的最多的便是if..else,而过多的if..else虽在逻辑上很正确,但计算机有时却不能更好的执行此逻辑,故用if..retrun代替;在用活动状态决定开始按钮状态时用了哈希的方法
function check_current_page_activity_status() { var status = Activity.get_current_page_activity_status(); var check_current_page_activity_status = { unStart: function () { $scope.start_or_unStart = Activity.start_or_cannot_click_start_button();//如果活动状态为unStart执行此function,以下类似 }, start: function () { $scope.start_or_unStart = 'unStart'; }, end: function () { $scope.start_or_unStart = 'end_sign_up'; } } if (check_current_page_activity_status [status]) { check_current_page_activity_status [status]() } }//if可以省略,因为活动的状态仅有上述三种(if的作用是,如果此状态存在则执行相应的方法)
2.在if()判断条件处如果是一个方法的返回值(或者是一个很长的判断条件)可以先定义一个变量等于要返回的那个函数(判断条件),这样会更一目了然
$scope.go_create = function () { var current_activity_bid = Bid.get_current_activity_bid(); if (!current_activity_bid) { $navigate.go('/create active') } }
同理如果一个函数的返回值很长也可以把返回值抽成方法,再返回
3.三目运算符的使用
之前:
if(activity_names.length==0){return false; }else{return true; }
之后:
return activity_names.length == 0 ? false : true
4.使用_.chain来解决需要多次处理一个数组却得多次定义的复杂性
例如:
_.chain(biddings[bid_name]) .groupBy(function (bidding) { return parseInt(bidding.price); }) .map(function (value, key) { return{"price": key, "count": value.length}//.map的为.groupBy处理后的biddings[bid_name] }) .value();//存在返回值
二.重构的方向
view:通过写haml来生成主界面,所需要的指示性数据,由controller提供
controller:中只写与界面交互的内容,不写具体的方法,通过调用方法来实现对界面的控制(提供view所需的数据源),
model:把所有controller所调的方法写在此model中,实现数据的增删改查
例如:
%button.btn.btn-primary(ng-switch-when ='start' ng-tap='start_sign_up()')开始
呈现在用户界面的是开始按钮可以点击,而start状态是在controller中提供的,而控制开始的方法又是在model定义的,controller调用
start_sign_up()方法也是在controller中调用的
三.model中方法的抽取
1.每个函数只实现一种功能
2.只有函数对象有prototype属性,每个函数都有构造函数constructor,当函数作为构造函数器构造一个新对象时函数的prototype属性才有意义,它所指的对象保留了新对象继承的属性
例如:
function Bid(activity_name) { var num = Activity.get_the_activity(activity_name).bids.length + 1; var name = '竞价' + num this.name = name; this.biddings = []; };//为函数对象 Bid.prototype.create = function (activity_name) { var activities = Activity.get_activities() var bid = this//新对象继承了Bid(activity_name)的属性,减少了数据传送(注:使用this要提前定义,因为在经过_.map后this的值会改变) _.map(activities, function (the_activity) { the_activity['name'] == Activity.get_current_activity() ? the_activity['bids'].push(bid) : '';