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 相关文章推荐
javascript十个最常用的自定义函数(中文版)
Sep 07 Javascript
Javascript 中 null、NaN和undefined的区别总结
Apr 10 Javascript
jQuery获取(选中)单选,复选框,下拉框中的值
Feb 21 Javascript
JavaScript随机生成信用卡卡号的方法
Apr 07 Javascript
深入浅析react native es6语法
Dec 09 Javascript
深入理解JavaScript程序中内存泄漏
Mar 17 Javascript
JS 根据子网掩码,网关计算出所有IP地址范围示例
Apr 23 Javascript
JavaScript制作简单分页插件
Sep 11 Javascript
基于JavaScript实现购物车功能
Feb 07 Javascript
angularJS之$http:与服务器交互示例
Mar 17 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
Jul 19 Javascript
js+canvas实现两张图片合并成一张图片的方法
Nov 01 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
绿山咖啡和蓝山咖啡
2021/03/04 新手入门
array_multisort实现PHP多维数组排序示例讲解
2011/01/04 PHP
PHP Curl多线程原理实例详解
2013/11/06 PHP
PHP使用socket发送HTTP请求的方法
2016/02/14 PHP
thinkphp3.2中实现phpexcel导出带生成图片示例
2017/02/14 PHP
PHP共享内存使用与信号控制实例分析
2018/05/09 PHP
PHP设计模式之抽象工厂模式实例分析
2019/03/25 PHP
详解new function(){}和function(){}() 区别分析
2008/03/22 Javascript
JavaScript为对象原型prototype添加属性的两种方式
2010/08/01 Javascript
兼容IE和FF的js脚本代码小结(比较常用)
2010/12/06 Javascript
关于JavaScript中原型继承中的一点思考
2012/07/25 Javascript
JS应用正则表达式转换大小写示例
2014/09/18 Javascript
JavaScript淡入淡出渐变简单实例
2015/08/06 Javascript
jQuery实用技巧必备(下)
2015/11/03 Javascript
javascript实现Email邮件显示与删除功能
2015/11/21 Javascript
Bootstrap插件全集
2016/07/18 Javascript
利用js来实现缩略语列表、文献来源链接和快捷键列表
2016/12/16 Javascript
ComboBox(下拉列表框)通过url加载调用远程数据的方法
2017/08/06 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
JavaScript遍历DOM元素的常见方式示例
2019/02/16 Javascript
Vue 实现手动刷新组件的方法
2019/02/19 Javascript
ES6基础之字符串和函数的拓展详解
2019/08/22 Javascript
深入探究Django中的Session与Cookie
2017/07/30 Python
基于循环神经网络(RNN)的古诗生成器
2018/03/26 Python
mac下pycharm设置python版本的图文教程
2018/06/13 Python
Python将列表数据写入文件(txt, csv,excel)
2019/04/03 Python
python IDLE添加行号显示教程
2020/04/25 Python
python中selenium库的基本使用详解
2020/07/31 Python
美国领先的奢侈手表在线零售商:WatchMaxx
2017/12/17 全球购物
班干部竞选演讲稿
2014/04/24 职场文书
团日活动总结书
2014/05/08 职场文书
领导欢迎词致辞
2015/01/23 职场文书
丧事酒宴答谢词
2015/09/30 职场文书
2016年青少年禁毒宣传教育活动总结(学校)
2016/04/05 职场文书
python使用matplotlib绘制图片时x轴的刻度处理
2021/08/30 Python
js中Object.create实例用法详解
2021/10/05 Javascript