Javascript 高阶函数使用介绍


Posted in Javascript onJune 15, 2015

高阶函数(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编程的利器。高阶函数实际上就是对基本算法的再度抽象,我们可以利用这一点,提高代码的抽象度,实现最大限度的代码重用,编写出更简洁、更利于重构的代码。

Javascript 相关文章推荐
javascript css float属性的特殊写法
Nov 13 Javascript
JavaScript打字小游戏代码
Dec 26 Javascript
JavaScript自执行闭包的小例子
Jun 29 Javascript
JS实现CheckBox复选框全选全不选功能
May 06 Javascript
jquery实现Li滚动时滚动条自动添加样式的方法
Aug 10 Javascript
js 弹出虚拟键盘修改密码的简单实例
Oct 10 Javascript
Javascript中字符串replace方法的第二个参数探究
Dec 05 Javascript
最好用的Bootstrap fileinput.js文件上传组件
Dec 12 Javascript
jQuery阻止事件冒泡实例分析
Jul 03 jQuery
说说Vuex的getters属性的具体用法
Apr 15 Javascript
react-native滑动吸顶效果的实现过程
Jun 03 Javascript
ES5和ES6中类的区别总结
Dec 21 Javascript
jQuery预加载图片常用方法
Jun 15 #Javascript
简述JavaScript中正则表达式的使用方法
Jun 15 #Javascript
简介JavaScript中用于处理正切的Math.tan()方法
Jun 15 #Javascript
在JavaScript中使用开平方根的sqrt()方法
Jun 15 #Javascript
JavaScript中的Math.sin()方法使用详解
Jun 15 #Javascript
JavaScript中用于四舍五入的Math.round()方法讲解
Jun 15 #Javascript
JavaScript中用于生成随机数的Math.random()方法
Jun 15 #Javascript
You might like
帝国cms常用标签汇总
2015/07/06 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
jQuery Selector选择器小结
2010/05/06 Javascript
JS 操作符整理[推荐收藏]
2011/11/15 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
2013/07/15 Javascript
YUI模块开发原理详解
2013/11/18 Javascript
js点击事件链接的问题解决
2014/04/25 Javascript
jQuery判断元素是否存在的可靠方法
2014/05/06 Javascript
JavaScript实现数字数组按照倒序排列的方法
2015/04/06 Javascript
jQuery 生成svg矢量二维码
2016/08/09 Javascript
详解jQuery的Cookie插件
2016/11/23 Javascript
Bootstrap表单简单实现代码
2017/03/06 Javascript
ES6 javascript中Class类继承用法实例详解
2017/10/30 Javascript
如何解决vue2.0下IE浏览器白屏问题
2018/09/13 Javascript
vue-router判断页面未登录自动跳转到登录页的方法示例
2018/11/04 Javascript
微信小程序实现上传照片代码实例解析
2020/08/04 Javascript
python基础知识小结之集合
2015/11/25 Python
python 环境变量和import模块导入方法(详解)
2017/07/11 Python
Python随机生成手机号、数字的方法详解
2017/07/21 Python
Tensorflow实现AlexNet卷积神经网络及运算时间评测
2018/05/24 Python
python实现字符串加密成纯数字
2019/03/19 Python
Python栈的实现方法示例【列表、单链表】
2020/02/22 Python
Python判断字符串是否为合法标示符操作
2020/09/03 Python
html5指南-6.如何创建离线web应用程序实现离线访问
2013/01/07 HTML / CSS
基于HTML5 WebGL的3D机房的示例
2018/03/16 HTML / CSS
幼儿园长自我鉴定
2013/10/17 职场文书
机械设计职业生涯规划书
2013/12/27 职场文书
中班开学寄语
2014/04/04 职场文书
同居协议书范本
2014/04/23 职场文书
小学英语教师先进事迹
2014/05/28 职场文书
咖啡店创业计划书
2014/08/15 职场文书
党委领导班子整改方案
2014/09/30 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
2016春节慰问信范文
2015/03/25 职场文书
2016最新离婚协议书范本及程序
2016/03/18 职场文书
Go 自定义package包设置与导入操作
2021/05/06 Golang