js函数柯里化的延伸

摘要:如果我们需要设计一个函数来计算每个月的开销,在每天结束之前,我们需要记录当天花费了多少。在月底的时候计算出这个月一共开销了多少? 可以看出在性能上和方式二差不多,但是这样做更加通俗易懂了,当然在实际开发中,我们一般会封装为对象。

需求: 

如果我们需要设计一个函数,来计算每个月的开销,在每天结束之前,我们需要记录当天花费了多少。在月底的时候计算出这个月一共开销了多少? 

下面的实现分为了4种方式,每种方式我们都会统计执行所消耗的时间。


方式一:

var total = 0;
function cost(money){
    total += money;
};
console.time(1)
cost(100);
cost(200);
cost(300);
console.log(total);//输出:600
console.timeEnd(1) //1: 4.392822265625ms

该实现方式,在每天结束都会累计当天的花费,但我们并不需要关心每天花掉多少,只需要记录一下就可以,在月底才进行统计一个月的开销是多少。


方式二:  

首先想到的是函数柯里化的使用。

var cost = (function(){
    var args = [];
    return function(){
        if(arguments.length === 0){
            var money = 0;
            for(var i in args){
                money += args[i];
            }
            return money;
        }else{
            [].push.apply(args, arguments);
        }
    }
}());
console.time(2)
cost(100);
cost(200);
cost(300);
console.log(cost());//求值并输出:600
console.timeEnd(2) //2: 0.22021484375ms

函数柯里化又称部分求值。是指一个函数首先会接受一些参数,但该函数并不会立即求值,而是返回另外一个函数,之前传入的参数 在函数形成的闭包里被保存起来。待到函数真正需要求值的时候,之前传入的参数都会被一次性用于求值。


方式三:    

柯里化看上去很高级,似乎也有点用处,然而很多需求不一定使用它是最好的实现,下面以以更通俗易懂的方式实现。

var total=[];
function set(data){
	total.push(data)
}
function get(){
	var money = 0;
	for(var i in total){
        money += total[i];
    }
	return money;
}
console.time(3)
set(100);
set(200);
set(300);
console.log(get());//求值并输出:600
console.timeEnd(3) //3: 0.19091796875ms

可以看出在性能上和方式二差不多,但是这样做更加通俗易懂了,当然在实际开发中,我们一般会封装为对象。


方式四:

将方式三的形式,通过封装对象来实现:

var obj={
	total:[],
	set:function(data){
		this.total.push(data)
	},
	get:function(){
		var money = 0;
		for(var i in this.total){
			money += this.total[i]
		}
		return money
	}
}
console.time(4)
obj.set(100);
obj.set(200);
obj.set(300);
console.log(obj.get());//求值并输出:600
console.timeEnd(4) //4: 0.185791015625ms


总结:

js是一门很灵活的语言,实现一些简单的需要,并不一定需要多么高级的实现模式,柯里化个人觉得实际项目中使用的并不多,js基础掌握好了,在同样性能的情况下,代码越简洁越好吧。下面看下上面四种方式的执行时间,当然不同浏览器有一定差异



本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://shenqiku.cn/article/FLY_1712