首页 > 代码库 > 关于js中高阶函数的认识
关于js中高阶函数的认识
Javascript中的高阶函数，是我们在编程中使用的一种重要的函数式编程，它的主要形式有两种。一种是把函数作为参数传递到另外一个函数中（例如：事件监听器），另一种是把函数作为返回值放入另外的函数中（例如：闭包函数）。
把函数作为参数传递的形式：
例：创建10个div并给每一个div中添加相应的数字
<body>
<div id="container">
</div>
</body>
<script>
//创建函数
function create(fn){
var container = document.getElementById(‘container‘);
for(var i=0;i<10;i++){
var div = document.createElement(‘div‘);
div.innerHTML = i+1;
container.appendChild(div);
if( typeof fn ==‘function‘){
fn(div);
}else{
console.log(‘输入错误！‘)
}
}
}
//子元素添加样式
//样式一
function setStyle(div){
div.style.margin =‘0 auto‘;
div.style.width = ‘100px‘;
div.style.height = ‘100px‘;
div.style.background = ‘deeppink‘;
div.style.border = ‘1px solid black‘;
div.style.display = ‘inline-block‘;
}
//样式二
function setStyle1(div){
div.style.margin =‘0 auto‘;
div.style.width = ‘50px‘;
div.style.height = ‘50px‘;
div.style.background = ‘blue‘;
div.style.border = ‘1px solid black‘;
div.style.display = ‘inline-block‘;
}
create(setStyle);
create(setStyle1);
</script>
把函数作为返回值形式
例：利用高阶函数，实现简单的加减乘除计算器
//计算公式
function add(a,b){
return a+b;
};
function sub(a,b){
return a-b;
};
function mul(a,b){
return a*b;
};
function div(a,b){
return a/b;
};
//高阶函数计算器
function calc(fn){
return function(){
if(typeof fn == ‘function‘){
return fn.apply(this,arguments);
}
}
};
var a = calc(add)(1,2);
var b = calc(sub)(1,2);
var c = calc(mul)(1,2);
var d = calc(div)(1,2);
console.log(a);//输出3
console.log(b);//输出-1
console.log(c);//输出2
console.log(d);//输出0.5
关于js中高阶函数的认识