Javascript 高阶函数使用介绍
更新时间：2015年06月15日 17:28:20 投稿：mdxy-dxy
这篇文章主要介绍了Javascript 高阶函数使用介绍,需要的朋友可以参考下
高阶函数（higher-order function）—如果一个函数接收的参数为或返回的值为函数，那么我们可以将这个函数称为高阶函数。众所周知，JavaScript是一种弱类型的语言:JavaScript的函数既不对输入的参数，也不对函数的输出值作强定义和类型检查,那么函数可以成为参数，也可以成为输出值,这就体现了JavaScript对高阶函数的原生支持。
一、参数为函数的高阶函数:
function funcTest(f){
//简易判断一下实参是否为函数
if((typeof f)==”function”){
f();
}}
funcTest(function(){ });
这是一个简易的将参数作为函数的高阶函数。在调用funcTest时，输入一个函数作为参数，在funcTest内部执行这个输入的匿名函数,当然这样的代码片段没有什么实际意义。
一、返回值为函数的高阶函数:
function funcTest(){
return function(){};
}
var f=funcTest();
调用funcTest返回一个函数。
二、一个复杂一点的例子:
//Number类型相加
function addInt(a,b){
return parseInt(a)+parseInt(b);
}
//String类型相加
function addString(a,b){
return a.toString()+ b.toString();
}
function add(type){
if(type==="string"){
return addString;
}else{
return addInt;
}
}
var data1=add("string")("1","2");
//12
var data2=add("int")("1","2");
//3
以上示例实现了一个String类型相加与Number类型相加的分离。调用add函数如果输入参数为”string”时,输出一个字符串拼接函数;如果输入参数为”int”则输出数字相加函数。
三、高阶函数的实际作用:
上面的代码示例基本说明什么是高阶函数，下面来看看高阶函数与我们实际编程有什么关系:
1,回调函数
function callback(value){
alert(value);
}
function funcTest(value,f)
//f实参检测，检查f是否为函数
if(typeof callback==='function'){
f(value);}}funcTest(‘1',callback);
//1
示例在当调用funcTest时,funcTest内部会调用callback函数,即实现回调。
2,数据筛选与排序算法
var arr=[0,2,11,9,7,5];
//排序算法
function funcComp(a,b){
if(a<b){
return -1;
}else if(a>b){
return 1;
}else{
return 0;
}
}
//过滤算法
function funcFilter(item,index,array){
return item>=5;
}
//数组顺序排列
arr.sort(funcComp);
alert(arr.join(','));
//0,2,5,7,9,11
//筛选数组
var arrFilter=arr.filter(funcFilter);
alert(arr.join(‘,'))
//5,7,9,11
3,DOM元素事件定义
<html><title></title>
<body><input type=”button” value=”ClickMe” id=”myBtn” >
<script type=”text/javascript>
var btnClick=document.getElementById(“myBtn”);
//测试环境为FireFox
btnClick. addEventListener(“click”,function(e){
alert(“I'm a button!”);
//I'm a button},false);
</script>
</body>
</html>
在以上示例中，文档中定义了一个id为myBtn的按钮，js脚本为其添加了一个点击事件,其中addEventListener的第二个参数是一个函数。
结束语:高阶函数并不是JavaScript的专利,但绝对是JavaScript编程的利器。高阶函数实际上就是对基本算法的再度抽象,我们可以利用这一点，提高代码的抽象度，实现最大限度的代码重用，编写出更简洁、更利于重构的代码。
相关文章
检测各种浏览器、系统的JS代码2009-04-04
这篇文章主要为大家详细介绍了如何利用Cesium实现卫星在轨绕行动画，文中的示例代码讲解详细，对我们了解Cesium有一定的帮助，感兴趣的可以尝试一下2022-06-06
这篇文章主要介绍了Typescript使用修饰器混合方法到类的实例，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
本篇文章主要介绍 typeScript 中接口是啥？如何定义的？接口是如何进行扩展的以及类如何实现接口，接下来和小编一起进入下面文章一起学习 typeScript 接口2022-02-02
在JavaScript中存在这样两种原始类型:Null与Undefined。这两种类型常常会使JavaScript的开发人员产生疑惑，在什么时候是Null，什么时候又是Undefined?2015-08-08
在WEB开发中，许多开发者都比较喜欢使用javascript来获取当前url网址，本文就此为大家总结一下比较常用获取URL的javascript实现代码2015-06-06
JavaScript中的函数本质上是一个对象，我们可以将这个对象赋值给一个变量，这就使JavaScript中的函数变得非常的灵活，现在就来浅看一下JavaScript中函数的一些用法,需要的朋友可以参考下2022-06-06
js 与或运算符 || && 妙用，可用于精简代码，降低程序的可读性。2009-12-12
一个很有趣的标签云兼容 IE 8亲测可用，不是基于jQuery的，所以不需要引入，下面是具体的代码实现2014-08-08
一个从来没有接触过javascript的技术人员，几小时内就可以写出一个简单有用的程序代码;想写出高性能的代码，同样需要具备一个高级程序员的基本素养,javascript也是如此2013-01-01
最新评论