JavaScript中高阶函数的使用例子

JavaScript这门动态语言的魅力之处在于其风格自由,所有皆对象,函数可以作为参数传递、可以作为对象返回。这也就是高阶函数的概念。

话不多说,直接列出使用例子方便理解:

1、函数柯里化(function currying):


            currying:

            var currying = function (fn) {
                var args = [];

                return function () {
                    if (arguments.length === 0) {
                        return fn.apply(this,args);
                    }else{
                        [].push.apply(args,arguments);
                        return arguments.callee;
                    }
                }
            }

            var cost = (function () {
                var money = 0;
                return function () {
                    for(var i=0,l=arguments.length;iarguments[i];
                    }
                    return money;
                }
            })();

            var cost = currying(cost);
            cost(300);      //无输出
            cost(100);      //无输出
            cost(100);      //无输出
            show(cost());   //500

2、非柯里化(uncurrying)


            Function.prototype.uncurrying = function () {
                var self = this;
                return function () {
                    var obj = Array.prototype.shift.call(arguments);
                    return self.apply(obj,arguments);
                }
            }

            var push = Array.prototype.push.uncurrying();
            (function () {
                push(arguments,4);
                console.log(arguments);
            })(1,2,3);      //输出1 2 3 4

3、让某函数在事件触发后严格遵守某时间间隔执行,避免重复


            var throttle = function (fn, interval) {
                var self = fn;
                var timer;
                var firstTime = true;

                return function () {
                    var args = arguments;
                    var me = this;

                    if (firstTime) {
                        self.apply(me,args);
                        return firstTime = false;
                    }

                    if (timer) {
                        return false;
                    }

                    timer = setTimeout(function () {
                        clearTimeout(timer);
                        timer = null;
                        self.apply(me,args);
                    },interval||500);
                }

            }
            window.onresize = throttle(function () {
                console.log(1);
            },500);

4、懒加载技术,数据太多时避免一次性全部加载,造成浏览器假死,一定的时间间隔,一批一批地加载:

            var timeChunk = function (ary, fn, count) {
                var obj;
                var t;

                var len = ary.length;

                var start = function () {
                    for(var i=0;i<Math.min(count||1,ary.length);i++){
                        var obj = ary.shift();
                        fn(obj);
                    }
                }

                return function () {
                    t = setInterval(function () {
                        if (ary.length === 0) {
                            return clearInterval(t);
                        }
                        start();
                    },500);
                }
            }

            var ary = [];
            for(var i=0;i<1000;i++){
                ary.push(i);
            }

            var render = timeChunk(ary,function (n) {
                console.log(n);
            },8);

            render();

5、函数内部改变函数本身:

            var timeChunk = function (ary, fn, count) {
                var obj;
                var t;

                var len = ary.length;

                var start = function () {
                    for(var i=0;i<Math.min(count||1,ary.length);i++){
                        var obj = ary.shift();
                        fn(obj);
                    }
                }

                return function () {
                    t = setInterval(function () {
                        if (ary.length === 0) {
                            return clearInterval(t);
                        }
                        start();
                    },500);
                }
            }

            var ary = [];
            for(var i=0;i<1000;i++){
                ary.push(i);
            }

            var render = timeChunk(ary,function (n) {
                console.log(n);
            },8);

            render();


你可能感兴趣的:(JavaScript)