party_bid第三张卡 小结

party—bid第三张卡  【竞价报名】

    要实现第三张卡其实和第二张卡的方法差不多。但是却用了很多时间，主要内容就是要理清逻辑，尽量简化逻辑，尽量优化代码。下面是我为了简化代码逻辑做的一些工作。

一，提取localStorage（）的相关处理函数。

思路：分析了各个控制器用到的LocalStorage函数不外乎是：    1)判断是存存在或是否有值  2)存 3)取 4)删除。将以前controller里面的localStorage给单独提取出来的，作为一个新的model，处理LocalStorage的model。

解决办法： 在LocalStorage_model.js文件里定义全局函数

//根据key判断localStorage是否为空

 function isKeyNULL(key)
{
  return localStorage.getItem(key)==null;
}

//根据key取出localStorage内容，并转化为对象格式

function getLocal(key)
 {
     var oneLocalStorage=isKeyNULL(key) ? []:JSON.parse(localStorage.getItem(key));
     return oneLocalStorage;
 }

//根据key，value存入localStorage，存入数组对象*

function setLocal(key,value)
{
   var  arr;
   arr=isKeyNULL(key) ? [] : JSON.parse(localStorage.getItem(key));
   arr.push(value);
   localStorage.setItem(key,JSON.stringify(arr));
}

/**根据key，删除某个localstorage*/

 function removeLocal(key)
 {
     localStorage.removeItem(key);
 }

注：关于localStorage的JSON.parse()     JSON.stringify()在第一张卡的总结中已经有详细的说明，此处不再论述。如果仅仅希望存字符串或单个对象，根据各自的功能要求修改函数内容。

二，一些有共性的函数和方法将他们划分为一个类，通过调用类方法和实例方法，减少代码中的全局函数，逻辑结构也比较清晰

思路：当我们编写的很多西有共性特点，我们可以考虑以类的方式来管理

解决办法：

          类的定义：构造函数（JS不是纯的面向对象编程，我们只是借鉴OOP的精神，这里利用构造函数，构造出一个类）

          实例的生成：利用类new 出一个对象实例

         类方法：有类调用

         实例方法：有new 出的对象实例调用

         关于类，实例，类方法，实例方法等一些概念，请看我的博客http://blog.csdn.net/fj2010080080026/article/details/38457679

这里我举一个例子：构造报名信息类

//报名信息类MessageRegister的构造函数
   function MessageRegister(activity_name,user_name,user_phone)
   {
       this.activity_name=activity_name;
       this.user_name=user_name;
       this.user_phone=user_phone;
   }

注：一般我们在构造函数中主要是对类的一些属性进行定义，而类的方法和实例方法的定义最好方法构造函数外部，由类名来标识。个人感觉这样会似的代码看起来更清晰哟！

//类方法的定义和调用

MessageRegister.verifiedMessage=function(json_message){.......}//定义类方法：验证报名信息是否格式正确

MessageRegister.verifiedMessage(json_message);                //调用类方法：类名.方法名（参数）

 //实例方法的定义和调用

MessageRegister.prototype.saveRegisterMessage=function(json_message){……} //定义实例方法：存储正确的报名信息

 var  message_register=new MessageRegister();         //new 出一个实例对象(用面向对象的解释就是，利用new来实现了：构造出一个实例对象，并且分配相应的内存空间）

message_register.saveRegisterMessage(json_message);               //只有实例对象才能调用实例方法 

                     

三，利用underscope库，优化代码，减少if else   与for循环的嵌套。

概述：underscore.js 是一个很精干的库，压缩后只有4KB。它提供了几十种函数式编程的方法，大大方便了Javascript的编程。MVC框架backbone.js就是基于这个库。它定义了一个下划线（_）对象，函数库的所有方法都属于这个对象。这些方法大致上可以分成：集合（collection）、数组（array）、函数（function）、对象（object）和工具（utility）五大类。

安装：在node.js下安装

npm install underscore

             这里我仅仅对卡三中常用的方法进行说明，并且推荐一篇博客 http://blog.csdn.net/adeyi/article/details/17611467。常用的是与集合（对象或者数组）有关的方法：

(1) filter方法依次对集合的每个成员进行某种操作，只返回操作结果为true的成员。

_.filter([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });  // [2, 4, 6]

(2)every方法依次对集合的每个成员进行某种操作，如果所有成员的操作结果都为true，则返回true，否则返回false。

     some方法则是只要有一个成员的操作结果为true，则返回true，否则返回false。

_.every([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });  // false
_.some([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });  // true

(3)find方法依次对集合的每个成员进行某种操作，返回第一个操作结果为true的成员。如果所有成员的操作结果都为false，则返回undefined。

_.find([1, 2, 3, 4, 5, 6], function(num){ return num % 2 == 0; });  // 2

(4)contains如果某个值在集合内，该方法返回true，否则返回false。

_.contains([1, 2, 3], 3);  // true

代码规范

_.方法名（传入的参数，function（参数1,……）
    {
        return ......;
    }）;

也可以

_(传入的参数).方法名（function（参数1,……）
    {
        return ......;
    }）;

最好保持同一种规范哦

4,避免魔法数，简化代码

    所谓魔法数即如下：

if(flag==0)
   {return  true;}
else
   {return false;}

 这是因为其实flag==0他本身就会返回一个true  or   false 的结果。我们可以直接return 就可以

return   flag==0;

当然如果希望返回的结果不是true   or   false，加上三目运算符也可以搞定

return   flag==0 ? 返回值1 :  返回值2

5.各个按钮状态变化

思路：还是与卡2【活动报名】的思路一样，将按钮的状态与当前页面的活动状态，竞价状态联系起来，在对应的Controller中实现对按钮状态的控制。

解决方法：参考我的博客   卡2。利用ng-switch实现。