关于js中高阶函数的认识
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了关于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中高阶函数的认识的主要内容,如果未能解决你的问题,请参考以下文章