0 Comments

JavaScript中的函数式编程实践(3)

发布于:2014-03-24  |   作者:广州网站建设  |   已聚集:人围观

将函数作为参数传递给其他函数

也可以将函数作为参数传递给其他函数。虽然这不是什么新概念,但是在后续的示例中大量的使用了这个概念。可以传递函数参数,如清单10所示。


  1. 清单 10. 将函数作为参数传递,并应用该函数  
  2. var passFunAndApply = function (fn,x,y,z) { return fn(x,y,z); };  
  3. var sum = function(x,y,z) {  
  4.   return x+y+z;  
  5. };  
  6. alert( passFunAndApply(sum,3,4,5) ); // 12 

执行最后一个alert语句输出了一个大小为12的值。
广州网站建设,网站建设,广州网页设计,广州网站设计

使用函数式概念

前一节介绍了一些使用函数式风格的编程概念。所给的示例并没有包含所有的概念,它们在重要性方面也没有先后顺序,只是一些与这个讨论有关的概念而已。下面对JavaScript中的函数式风格作一快速总结:

◆函数并不总是需要名称; ◆函数可以像其他值一样分配给变量; ◆函数表达式可以编写并放在括号中,留待以后应用; ◆函数可以作为参数传递给其他函数。

这一节将介绍一些有效使用这些概念编写优美的JavaScript代码的示例。

扩展数组排序

先来编写一个排序方法,可以根据数组元素的日期对数据进行排序。用JavaScript编写这个方法非常简单。数据对象的排序方法接受一个可选参数,这个可选参数就是比较函数。在这里,需要使用清单11中的比较函数。


  1. 清单 11. 比较函数  
  2. function (x,y) {  
  3.  return x.date – y.date;  

要得到需要的函数,请使用清单12的示例。


  1. 清单 12. 排序函数的扩展  
  2. arr.sort( function (x,y) { return x.date – y.date; } ); 

其中 arr 是类型数组对象。排序函数会根据arr数组中对象的日期对所有对象进行排序。比较函数和它的定义一起被传递给排序函数,以完成排序操作。使用这个函数:
广州网站建设,网站建设,广州网页设计,广州网站设计

◆每个JavaScript对象都有一个date属性。

◆JavaScript的数组类型的排序函数接受可选参数,可选参数是用来排序的比较函数。这与C库中的qsort函数类似。

动态生成HTML的优美代码

在这个示例中,将看到如何编写优美的代码,从数组动态地生成HTML。可以根据从数据中得到的值生成表格。或者,也可以用数组的内容生成排序和未排序的列表。也可以生成垂直或水平的菜单项目。清单13中的代码风格通常被用来从数组生成动态HTML。


  1. 清单 13. 生成动态 HTML 的普通代码  
  2. var str=' ';  
  3. for (var i=0;i<arr.length;i++) {  
  4.   var element=arr[i];  
  5.   str+=... HTML generation code...  
  6. }  
  7. document.write(str); 

可以用清单14的代码替换这个代码。


  1. 清单 14. 生成动态 HTML 的通用方式  
  2. Array.prototype.fold=function(templateFn) {  
  3.   var len=this.length;  
  4.   var str=' ';  
  5.   for (var i=0 ; i<len ; i++)   
  6.  str+=templateFn(this[i]);  
  7.   return str;  
  8. }  
  9.  
  10. function templateInstance(element) {  
  11.   return ... HTML generation code ...  
  12. }  
  13.  
  14. document.write(arr.fold(templateInstance)); 

这里使用的是Array类型的prototype属性定义新函数fold。现在可以在后面定义的任何数组中使用该函数。

标签:
飞机