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


Posted in Javascript onJanuary 10, 2013

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

几个函数
这几个方法均为javascript 1.6 数组新增的方法。是很典型的functional 函数,当然也非常实用。下面是functional的定义并不来自javascript。

filter:接受一个集合Xs(X表示类型,s表示集合),一个谓词,这个谓词是从X到bool的映射(函数)。然后过虑这个集合,并返回谓词为true的元素组成的集合。下面是简单的实现:

function filter(arr,callback){ 
var i,out=[]; 
for(i=0;i<arr.length;i++){ 
if(callback(arr[i])) 
out.push(arr[i]); 
} 
return out; 
}

再加一个简单的测试:
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var even = function(item){ 
if(typeof item !== "number") return false; 
return !(item & 1); 
}; 
var filtered = filter(arr,even); 
console.log(filtered);

结果:
2,4,6,8,10
map:接受一个集合Xs,一个函数f,然后把Xs集合中每一个元素按照顺序使用f映射,并返回集合f x1, f x2, f x3 ... f xn。实现如下:
function map(arr,callback){ 
var i,l= arr && arr.length || 0,out = new Array(l); 
for(i=0;i<l;i++) 
out[i]=callback(arr[i]); 
return out; 
}

测试一下:
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var addTen = function(item){ 
return item + 10; 
}; 
var mapAdded = map(arr,addTen); 
console.log(mapAdded);

结果:
11,12,13,14,15,16,17,18,19,20
另外还有forEach,every和some三个函数在javascript 1.6中出现。但在使用过程中感觉还是缺少一个有力的函数,它就是折叠函数(fold)。正所谓map-reduce,有了map而没有"reduce"岂不是很扫兴?下面就来看看这个”reduce“。

Reduce的实现
上面说的reduce其实也就是折叠函数(fold)。它接受一个Xs集合,一个二元操作符f。然后将f插入到集合中的每两个相邻元素之间。举个例子,fold plus [1,2,3,4] 意即 1+2+3+4。为了更加精确,通常需要一个”起始元素“作为f最开始时的第二个参数。例如 fold plus [1,2,3,4] 意即 (1+(2+(3+(4+0)))。下面是实现:

function fold(arr,callback,b){ 
var i,x; 
if(b) x=b,i=0; 
else x=arr[0],i=1; 
for(;i<arr.length;i++) 
x=callback(arr[i],x); 
return x; 
}

测试:
var arr = [1,2,3,4,5,6,7,8,9,10]; 
var plus = function(a,b){ 
return a+b; 
}; 
var foldPlus = fold(arr,plus,0); 
console.log(foldPlus);

结果:
55

这个函数在ECMAScript 5中名字就叫reduce,而函数式里面通常称做fold而已,这是很形象的名字。
总结
其实上面在实现这些functional函数的时候编写风格并不是函数式的,因为javascript 语言有具有循环语句。如果没有循环语句呢?留给下一次探索吧。

Javascript 相关文章推荐
JQUERY的属性选择符和自定义选择符使用方法(二)
Apr 07 Javascript
javascript作用域容易记错的两个地方分析
Jun 22 Javascript
Jquery中给animation加更多的运作效果实例
Sep 05 Javascript
JavaScript用Number方法实现string转int
May 13 Javascript
使用VS开发 Node.js指南
Jan 06 Javascript
javascript 判断页面访问方式电脑或者移动端
Sep 19 Javascript
Jil,高效的json序列化和反序列化库
Feb 15 Javascript
JS原生带小白点轮播图实例讲解
Jul 22 Javascript
React.Js添加与删除onScroll事件的方法详解
Nov 03 Javascript
Vue2.0 实现歌手列表滚动及右侧快速入口功能
Aug 08 Javascript
如何基于javascript实现贪吃蛇游戏
Feb 09 Javascript
vue-cli创建的项目中的gitHooks原理解析
Feb 14 Javascript
根据json字符串生成Html的一种方式
Jan 09 #Javascript
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
Jan 09 #Javascript
web的各种前端打印方法之jquery打印插件PrintArea实现网页打印
Jan 09 #Javascript
实现web打印的各种方法介绍及实现代码
Jan 09 #Javascript
js去除重复字符串两种实现方法
Jan 09 #Javascript
jquery插件之信息弹出框showInfoDialog(成功/错误/警告/通知/背景遮罩)
Jan 09 #Javascript
javaScript矢量图表库-gRaphael几行代码实现精美的条形图/饼图/点图/曲线图
Jan 09 #Javascript
You might like
PHP中header和session_start前不能有输出原因分析
2013/01/11 PHP
windows服务器中检测PHP SSL是否开启以及开启SSL的方法
2014/04/25 PHP
PHP遍历目录文件的常用方法小结
2017/02/03 PHP
PHP文件管理之实现网盘及压缩包的功能操作
2017/09/20 PHP
PHP实现的猴王算法(猴子选大王)示例
2018/04/30 PHP
JavaScript更改class和id的方法
2008/10/10 Javascript
jQuery live
2009/05/15 Javascript
JavaScript下利用fso判断文件是否存在的代码
2010/12/11 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
JavaScript中的字符串操作详解
2013/11/12 Javascript
JS随机调用指定函数的方法
2015/07/01 Javascript
全面解析bootstrap格子布局
2016/05/22 Javascript
AngularJS入门教程之静态模板详解
2016/08/18 Javascript
javascript汉字拼音互转的简单实例
2016/10/09 Javascript
Centos7 中 Node.js安装简单方法
2016/11/02 Javascript
Ajax 加载数据 练习代码
2017/01/05 Javascript
jquery实现文字单行横移或翻转(上下、左右跳转)
2017/01/08 Javascript
Vue2.0使用嵌套路由实现页面内容切换/公用一级菜单控制页面内容切换(推荐)
2019/05/08 Javascript
Javascript中的this,bind和that使用实例
2019/12/05 Javascript
D3.js 实现带伸缩时间轴拓扑图的示例代码
2020/01/20 Javascript
[50:05]VGJ.S vs OG 2018国际邀请赛淘汰赛BO3 第二场 8.22
2018/08/23 DOTA
[46:23]OG vs EG 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
Python中的Descriptor描述符学习教程
2016/06/02 Python
使用python读取.text文件特定行的数据方法
2019/01/28 Python
英国最受欢迎的手表网站:Watch Shop
2016/10/21 全球购物
UGG澳洲官网:UGG Australia
2018/04/26 全球购物
FLOS美国官网:意大利高级照明工艺的传奇
2018/08/07 全球购物
Dower & Hall官网:英国小众轻奢珠宝品牌
2019/01/31 全球购物
教师年终个人自我评价
2013/10/04 职场文书
优秀驾驶员先进事迹材料
2014/05/04 职场文书
艺术设计专业求职自荐信
2014/05/19 职场文书
工作骂脏话检讨书
2014/10/05 职场文书
2014年物业公司工作总结
2014/11/22 职场文书
幼儿园教师教育随笔
2015/08/14 职场文书
护士业务学习心得体会
2016/01/25 职场文书
IDEA2021.2配置docker如何将springboot项目打成镜像一键发布部署
2021/09/25 Java/Android