js 函数 拦截器

开放利于互联网创新与发展,写博文无非就是帮助网友解决问题、思想碰撞、诞生创新,但是我非常恶心转载之后还写个“原创”的人,如需转载请注明出处,请尊重原创,Thank you!


我们通常在写程序的时候需要统一的对所有代码进行权限验证,如果没登陆则不允许继续访问,这种可以用拦截器的思想来做,反观js,我们是否也有这种类似的场景呢?比如我对输入的数据进行验证是否符合规定,你可以说我直接写在函数里面就好了呀,如下:

[javascript]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. var t = function (txt) {  
  2.     if(txt.v<100){  
  3.        alert("输入的数字必须大于100");  
  4.        return false;  
  5.     }  
  6.     alert("调用 t 您输入了正确的数字:" + txt.v);  
  7.     return txt;  
  8. }  
  9. t({v:100});  

嗯,如果我突然发现100个函数都要检查输入呢?

你说可以写成这样:

[javascript]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. var check=function(txt){  
  2.      if(txt.v<100){  
  3.        alert("输入的数字必须大于100");  
  4.        return false;  
  5.     }  
  6. }  
  7. var t1 = function (txt) {  
  8.     if(!check(txt)){  
  9.         return false;  
  10.     }  
  11.     alert("调用 t 您输入了正确的数字:" + txt.v);  
  12.     return txt;  
  13. }  
  14. var t2 = function (txt) {  
  15.     if(!check(txt)){  
  16.         return false;  
  17.     }  
  18.     alert("调用 t 您输入了正确的数字:" + txt.v);  
  19.     return txt;  
  20. }  
  21. t1({v:100});  
  22. t2({v:293});  

ok,这样确实也可以,但不得不说,你不觉的每个函数里面都要写个if语句和return很恶心么?就算不恶心,现在我要求写10个验证,验证是否是字母,是否身份证,blabla....

意味着你每个函数里面要写10个判断,如果我还要求t1需要作验证但除了字母和数字,t2除了数字不验证,你蛋疼了么?是不是很操蛋这种需求,至少我觉得这种需求完全是bullshit,但是程序嘛,我们追求通用、艺术(请允许我用艺术来装一下B)。


我们可以用一种更优雅的方式来实现这个操蛋的需求并且装一次优雅的B:

1.首先定义一个aop,aop里面加一个函数before,他的作用就是给指定的函数注入逻辑代码,也就是说在我们的函数执行之前先执行注入的代码

2.定义一个原始函数t,即我们需要被注入逻辑处理的函数,没注入之前他啥也不验证,任何参数都说合法

3.定义逻辑处理函数若干,命名为:bh1,bh2,如果你还想更操蛋更优雅那你多写几个

4.在执行原始函数t之前对这个函数注入逻辑处理,至于注入几个这个请根据你具体想装B到啥程度

5.最后调用t吧,你会看到他会根据给t注入时设置的验证规则(全成功则执行t,全失败则执行t,有一个成功则执行t,有一个失败则执行t),有同学要丢我板砖,有一个执行成功不就代表必定有一个失败吗?在某种情况下还是不一样的。

[javascript]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. var aop = {  
  2.             isPass: function (t, f, s, mode) {  
  3.                 switch (mode.toString().toUpperCase()) {  
  4.                     case "AS"//all success  
  5.                         return t === s;  
  6.                     case "AF"//all fail  
  7.                         return t === f;  
  8.                     case "OS"// one success  
  9.                         return s > 0;  
  10.                     case "OF"// one success  
  11.                         return f > 0;  
  12.                     default:  
  13.                         return t === s; //all success  
  14.                 }  
  15.             }  
  16.             , before: function (name, f, check, mode) {  
  17.                 var thisObj = this;  
  18.                 var orign = eval(name);  
  19.                 var func = function () {  
  20.                     var fail = 0;  
  21.                     var success = 0;  
  22.                     for (var i in f) {  
  23.                         if (!(f[i].apply(this, arguments))) {  
  24.                             fail++;  
  25.                         } else {  
  26.                             success++;  
  27.                         }  
  28.                     }  
  29.                     if (check) {  
  30.                         if (thisObj.isPass(f.length, fail, success, mode)) {  
  31.                             return orign.apply(this, arguments);  
  32.                         }  
  33.                     } else {  
  34.                         return orign.apply(this, arguments);  
  35.                     }  
  36.                 }  
  37.                 eval(name + " = func;");  
  38.             }  
  39.         };  
  40.   
  41.         // 原始函数  
  42.         var t = function (txt) {  
  43.             alert("调用 t 您输入了正确的数字:" + txt.v);  
  44.             return txt;  
  45.         }  
  46.         //业务逻辑1  
  47.         function bh1(arg) {  
  48.             if (/^(\d+)|(\d+\.\d)$/.test(arg)) {  
  49.                 return true;  
  50.             } else {  
  51.                 alert("只能输入数字");  
  52.                 return false;  
  53.             }  
  54.         }  
  55.         //业务逻辑2  
  56.         function bh2(arg) {  
  57.             if (parseFloat(arg.v) > 100) {  
  58.                 return true;  
  59.             } else {  
  60.                 alert("输入的数必须大于100");  
  61.                 return false;  
  62.             }  
  63.         }  
  64.   
  65.         $(function () {  
  66.             // 参数:函数名,过滤器数组,是否验证,验证模式(as表示all success,表示如果有一个失败则不执行函数t)  
  67.             aop.before("t", [bh1,bh2], true"as");// 添加拦截器  
  68.             var o = { v: 99 };//参数值  
  69.             t(o);  
  70.         })  
  • 3
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值