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

赞 (0)

相关推荐

  • Javascript中的高阶函数介绍

    这是一个有趣的东西,这或许也在说明Javascript对象的强大.我们要做的就是在上一篇说到的那样,输出一个Hello,World,而输入的东西是print('Hello')('World'),而这就是所谓的高阶函数. 高阶函数 高阶看上去就像是一种先进的编程技术的一个深奥术语,一开始我看到的时候我也这样认为的. Javascript的高阶函数 然而,高阶函数只是将函数作为参数或返回值的函数.以上面的Hello,World作为一个简单的例子. 复制代码 代码如下: var Moqi = func

  • javascript之典型高阶函数应用介绍二

    前言 在前一篇文章javascript之典型高阶函数中主要实现了几个典型的functional函数.文章最后也提出了疑问,为啥那样的实现与F#之类的函数式语言"不太一样"呢?今天来试试更"函数式"的实现. 另一种实现 同样地,尝试对之前实现的函数做一些改动,把for循环去掉.如何去掉呢?这里先要引入一个集合的归纳法定义: 一个集合要么是空集,要么是一个数与一个集合组成的数对从定义可以看到,每一个集合都可以看作为一个数和一个集合的对.例如:{1,2,4,5} 可以认为

  • Javascript 是你的高阶函数(高级应用)

    在通常的编程语言中,函数的参数只能是基本类型或者对象引用,返回值也只是基本数据类型或对象引用.但在Javascript中函数作为一等公民,既可以当做参数传递,也可以被当做返回值返回.所谓高阶函数就是可以把函数作为参数,或者是将函数作为返回值的函数.这两种情形在实际开发中有很多应用场景,本文是我在工作学习中遇到的几种应用场景的总结. 回调函数 代码复用是衡量一个应用程序的重要标准之一.通过将变化的业务逻辑抽离封装在回调函数中能够有效的提高代码复用率.比如ES5中为数组增加的forEach方法,遍历

  • javascript之典型高阶函数应用介绍

    缘由 虽然以前也使用过javascript语言,但终究是为了配合后端写的一些零零散散的"代码段",更不能说是javascript项目了.很荣幸的是上个月刚到公司正好碰上项目开始推倒重写,我们team从头开始做架构和实现,目的很清楚,为了改进和超越前面的版本.这是个真正意义上的javascript"项目",当然服务端不是我们team来负责啦.这也是我真正开始全职使用javascript来编程.由于之前在学校对形式化方法这门课程比较感兴趣,而javascript又是函数

  • JavaScript高阶函数_动力节点Java学院整理

    高阶函数英文叫Higher-order function.那么什么是高阶函数? JavaScript的函数其实都指向某个变量.既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数. 一个最简单的高阶函数: function add(x, y, f) { return f(x) + f(y); } 当我们调用add(-5, 6, Math.abs)时,参数x,y和f分别接收-5,6和函数Math.abs,根据函数定义,我们可以推导计算过程为

  • Javascript 高阶函数使用介绍

    高阶函数(higher-order function)-如果一个函数接收的参数为或返回的值为函数,那么我们可以将这个函数称为高阶函数.众所周知,JavaScript是一种弱类型的语言:JavaScript的函数既不对输入的参数,也不对函数的输出值作强定义和类型检查,那么函数可以成为参数,也可以成为输出值,这就体现了JavaScript对高阶函数的原生支持. 一.参数为函数的高阶函数: function funcTest(f){ //简易判断一下实参是否为函数 if((typeof f)=="fu

  • 详解JavaScript 高阶函数

    高阶函数简介 高阶函数 的英文名叫 Higher-Order Function ,是 函数式编程 中的一种.他的表现形式往往是通过把函数作为参数传入另一个函数,或者将函数作为另一个函数的返回值返回.在实际开发业务中, 高阶函数往往可以抽象我们的代码 ,将我们的命令式编程转换为复用性更高级的函数式编程,从而 提升我们的代码质量 . 下面拿3个面试中常问的高阶函数举例子,希望看完以后能够提升大家对JS的理解,提高我们的代码质量. chat is cheap,show you my code~ Arr

  • python 高阶函数简单介绍

    把函数作为参数传入,这样的函数称为高阶函数,高阶函数是函数式编程的体现.函数式编程就是指这种高度抽象的编程范式. 1.体验高阶函数 在Python中,abs()函数可以完成对数字求绝对值计算. abs(-10) # 10 round()函数可以完成对数字的四舍五入计算. round(1.2) # 1 round(1.9) # 2 需求:任意两个数字,按照指定要求整理数字后再进行求和计算. 方法1 def add_num(a, b): return abs(a) + abs(b) result =

  • 深入学习JavaScript 高阶函数

    高阶函数 高阶函数英文叫 Higher-order function,它的定义很简单,就是至少满足下列一个条件的函数: 接受一个或多个函数作为输入 输出一个函数 也就是说高阶函数是对其他函数进行操作的函数,可以将它们作为参数传递,或者是返回它们. 简单来说,高阶函数是一个接收函数作为参数传递或者将函数作为返回值输出的函数. 函数作为参数传递 JavaScript 语言中内置了一些高阶函数,比如 Array.prototype.map,Array.prototype.filter 和 Array.

  • JavaScript中常见的高阶函数总结

    JavaScript中常见的高阶函数总结

    目录 前言 map函数 reduce函数 filter函数 sort every方法 find方法 findIndex方法 foreach方法 总结 前言 一个函数可以接受另一个函数作为参数,就把这个函数叫做高阶函数. 一个最简单的高阶函数: function add(x, y, f) { return f(x) + f(y); } //当调用add(-5, 6, Math.abs)时,参数x,y和f分别接收-5,6和函数Math.abs,根据函数定义,可以推导计算过程为: //x = -5;

  • 从柯里化分析JavaScript重要的高阶函数实例

    目录 前情回顾 百变柯里化 缓存传参 缓存判断 缓存计算 缓存函数 防抖与节流 lodash 高阶函数 结语 前情回顾 我们在前篇 <从历史讲起,JavaScript 基因里写着函数式编程> 讲到了 JavaScript 的函数式基因最早可追溯到 1930 年的 lambda 运算,这个时间比第一台计算机诞生的时间都还要早十几年.JavaScript 闭包的概念也来源于 lambda 运算中变量的被绑定关系. 因为在 lambda 演算的设定中,参数只能是一个,所以通过柯里化的天才想法来实现接

  • 8个JavaScript中高阶函数的运用分享

    目录 函数作为参数传递 函数作为返回值 函数柯里化 函数组合 面向切面编程 函数式编程 闭包 复杂的例子 函数作为参数传递 高阶函数可以接受一个或多个函数作为参数,这些函数可以在高阶函数中被调用,实现某种特定的功能 function operation(num1, num2, callback) { let result = callback(num1, num2); console.log(result); } function add(num1, num2) { return num1 +

随机推荐