JS函数式编程

最新推荐文章于 2023-05-12 09:38:03 发布

唐小狼

最新推荐文章于 2023-05-12 09:38:03 发布

阅读量627

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 前端工程师学习笔记

本文链接：https://blog.youkuaiyun.com/tangxiaolang101/article/details/52065787

前端工程师学习笔记同时被 2 个专栏收录

85 篇文章

订阅专栏

javascript

30 篇文章

订阅专栏

本文介绍了函数式编程的概念，对比了其与指令式及过程化编程的区别，并通过具体实例展示了函数式编程的应用，如高阶函数、扩展数组排序、系列函数的应用等。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、概念相关

“函数式编程”是这种编程典范，它将电脑运算视为函数的计算。和指令式编程相比，函数式编程强调函数的计算比指令的执行重要；和过程化编程相比，函数式编程里，函数的计算可随时调用。
函数式编程的重点是函数的定义而不是状态机（state machine）的实现
函数式概念的运用，例如：扩展数组排序、动态HTML生成的优美代码、系列函数的应用。

二、应用概念

1、高阶函数

可以操作其它函数的函数，被称为高阶函数。利用高阶函数可以简化操作。

三、应用代码

扩展数组排序

var a = {
	value: 1,
	date: 2001
	}
var b = {
	value: 2,
	date:2002
	}
var c = {
	value: 3,
	date:2003
	}
var str = [a,c,b];
var str2 = ['zx','z','yz'];
str2.sort();
console.log(str2);
	str.sort(function(x,y){
		return x.date - y.date;
	});
console.log(str);

系列函数应用

Function.prototype.sequence=function(g) {
  var f=this;
  return function() {
    f();g();
  }
};
function alertFrst() { alert('First!'); }
function alertSec() { alert('Second!'); }2
setTimeout( alertFrst.sequence(alertSec), 5000);

一组函数作为回调函数

匿名函数

var averageF = function(x,y){
  return (x+y)/2;
  }

通过匿名函数，没有必要把函数一直放在内存中，所以使用匿名函数更加有效率。

“短路”条件调用

var f = false;
var t = true;
var z = (f&&4)||(t&&2);
console.log(z);

规约函数

function forEach(array, func){
	for(var i = 0; i<array.length;i++){
	    func(array[i]);
	}
}
	
function reduce(combine, base, array){
	forEach(array, function(value){
		base = combine(base, value);
	});
	return base;
}
		
function countZeros(count, value){
	return value == 0? (count + 1):count;
}
		
function add(sum, value){
	return value + sum;
}
		
var a = [1,2,3,4,0];
console.log(reduce(countZeros, 0, a));
console.log(reduce(add, 0, a));

分布应用，函数的一个操作符给定。例如：对数组中的每一个元素都+1的操作。

function forEach(array, func){
    for(var i = 0; i<array.length;i++){
	func(array[i]);
	}
}
	
function reduce(combine, base, array){
	forEach(array, function(value){
		base = combine(base, value);
	});
	return base;
}
		
function countZeros(count, value){
	return value == 0? (count + 1):count;
}
		
function add(sum, value){
	return value + sum;
}
		
function map(func, array){
	var result = [];
    forEach(array, function(value){
	    result.push(func(value));
    });
	return result;
}
		
var ops = {
	"+": function(x,y){return x+y},
	"-": function(x,y){return x-y},
	"*": function(x,y){return x*y},
	"/": function(x,y){return x/y}		
};
		
function partial(func){
     var knowArgs=arguments;
     return function(){
         var realArgs=[];
         for(var i = 1; i < knowArgs.length; i++){
             realArgs.push(knowArgs[i]);
         }
         for(var i = 0; i < arguments.length; i++){
             realArgs.push(arguments[i]);
        }
        return func.apply(null, realArgs);
     }
 }
var a = [1,2,3,4,0];

console.log(map(partial(ops["+"], 1), a));