美文网首页JavaScript
JS函数式编程

JS函数式编程

作者: 彬哥头发多 | 来源:发表于2017-05-10 19:25 被阅读114次

    我在网上看了很多关于javascript的函数式编程的教程,不过我感觉很多不是照抄的或者就是故弄玄虚。js发展到今天越来越往瑜伽圈的风气发展了,拿腔拿调装13不好好说话,好像你讲的东西别人听懂了就是你水平不行似得。大家上过瑜伽课肯定有体验,比如说一个简单动作,吸气手臂往上,他非这么说:

    随着下一次吸气,将你的双臂经由体侧柔和的伸展向天空的方向,感受你和宇宙能量的充分连接。

    你至于么!说吸气手臂往上!不就完了么。

    所以呢JS函数编程我能用一个字说清楚,就不用两个字儿,别跟我整没用的什么内存啦,什么first-class function了,你妹啊,你至于么,说函数可以当参数传递不就得了么,能用一个字儿,绝壁不用两个字儿。

    好吧,今天五一就给大家列列我经常一个字儿回答的问题吧。

    1.老师我们是不是线上讲课啊?

    答:嗯

    2.老师我们有视频吗?

    答:有

    3.老师我学了这个课工作用中有不会的还可以问你不?

    答:行

    4.老师如果如果线上学不会我能线下跟你学不?

    答:好

    5.老师我怕学不好咋办?

    答:练。

    6.老师我一直听你的课,觉得你讲的可好了,这个课能先跟着学一段看看我能不能学会再报名不?

    答:滚。

    好了,不扯淡了。函数式编程几分钟就完事儿了,简单的让人发指。举个例子,数组加倍

    面向过程

            var arr = [1,2,3];
            var arr2 = [];
            for(var i = 0;i<arr.length;i++){
              arr2.push(arr[i]*2);
            }
            console.log(arr2);
    

    函数式编程,你记住怎么爽怎么来,能用函数的地方就别散养,举个例子上面的例子看看函数式编程咋玩。

            function forEach(arr,fn){
              var newArr = [];
              for(var i = 0;i<arr.length;i++){
                newArr.push(fn(arr[i]*2));
              }
              return newArr;
            }
            var arr = [1,2,3];
            var arr2 = forEach(arr,function(item){
                return item;
            });
            console.log(arr2);
    

    有人可能会说我没感觉出来函数式样编程有啥好处啊,对,因为你是为了用它而用它,大家要注意,技术一定是为了简化问题存在的,而不是复杂它,所以上面的例子是错的,换个思路我们看看。

            function forEach(arr,fn){
              var newArr = [];
              for(var i = 0;i<arr.length;i++){
                newArr.push(fn(arr[i]));
              }
              return newArr;
            }
            var arr = [1,2,3];
            var arr2 = forEach(arr,function(item){
                return item*2;//重点是这里
            });
            console.log(arr2);
    
    

    有啥用,这个是angular过滤器的基础,实现一个类似过滤器的例子。数组里面的数如果大于2我没返回一个true如果小于2返回false。类似这样

    [1,2,3]->[false,false,true]为什么这么做,经常过滤器过滤东西根据条件返回对应的true或者false

            function forEach(arr,fn){
              var newArr = [];
              for(var i = 0;i<arr.length;i++){
                newArr.push(fn(arr[i]));
              }
              return newArr;
            }
            var arr = [1,2,3];
            var arr2 = forEach(arr,function(item){
                return item>2;
            });
            console.log(arr2);
    

    看见了吧,是不是很简单,函数式编程的好处是,通过不同的函数组合实现对js状态的改变,而不是像面向过程一样通过影响全局变量的方式,也不是面向对象通过考虑如何添加对象身上方法的方式。

    函数式编程理解这么多就够了,再实用就可以看angular源码了。

    相关文章

      网友评论

        本文标题:JS函数式编程

        本文链接:https://www.haomeiwen.com/subject/wxngtxtx.html