map()函数小简单介绍


map()函数一直都是我觉得比較有用的函数之中的一个,为什么这么说呢?

先来考虑一下。你是否碰到过下面场景:须要遍历一组对象取出每一个对象的某个属性(比方id)而且用分隔符隔开

我想你一定有碰到过吧!

由于我已经碰到过非常多次了,这就是map()函数的一个典型的适用场景

不仅在前台,后台也是(所以后面我在java中也简单实现了这么一个方法)。以下就看看吧

map()函数实例


在jQuery中,如.each()一样,.map()函数也有两种形式:一种是提供给jQuery对象用的.map(),另一种是为普通的数组的jQuery.map()

jQuery.map()


两者适用起来都很easy。先拿jQuery.map()来说吧,就前面我们提出的场景:比方在easyUI的datagrid中。我们须要实现改变多条记录的状态。那么势必会用checkbox勾选多条记录,而且会将这一组记录的id和须要改动的状态值传到后台。那么得到这一组记录id的过程就是jQuery.map()的一个典型应用,由于通过datagrid.datagrid('getSelections')取出的是一组普通的json数组

以下的代码实现了批量编辑员工角色:

        var rows = $('#employee_table').datagrid('getSelections');
if (rows){
var empnos = $.map(rows, function(v){
return v.empno;
}).join(",");
employee_save_url = "test/editEmployee? empnos=" + empnos;
$('#employee_dialog').dialog('open').dialog('setTitle','改动员工角色').dialog('center');
}

这仅仅是map()函数的一个典型应用,它再官网上的定义事实上是:将一个数组中的全部元素转换到还有一个数组中。

好像是这种。回想上面的样例,就是将一个employee(json)所构成的数组转换成了一个empno(string)构成的数组。

再看看它的callback函数,在$.map()的callback函数中能够有两个參数。从jQuery1.6開始,第一个是当前遍历到的记录,而第二个则是数字索引,从0開始。

你应该注意到了,该函数的返回值。将会被映射到终于转换的数组中去。

须要注意的是,这里的返回值还会有2种特殊情况:

1、null或者undefined,
用于移除该元素

2、数组。会将该数组中的元素加入到终于的结果数组中

关于这2种特殊情况再给出2个实例代码吧:

	var arr = [{id:0, name:'张三', age: 10}, {id:1, name:'李四', age:12}, {id:3, name:'朱六', age:10}];
var value = $.map(arr, function(v){
return v.name == '李四' ? null : v.name;// 这里排除李四
}).join();
alert(value);// 这里的结果是“张三,朱六” value = $.map( [0,1,2], function(n){
return [ n, n + 1 ];
}).join();
alert(value);// 这里的结果是0,1,1,2,2,3

这里再补充一个小知识:

事实上js里已经为array提供了map()函数。且效果与$.map(arr, function (v){})类似

只是在使用过程中我发现当return null的时候,两者的处理有差别,比方上面的样例中,排除李四,那么结果是“张三。朱六”

而对于js中的map()函数而言。返回的是“张三,。朱六”。看到了吗?当中的位子还是会被占,至于详细使用哪个就看详细的逻辑了。

.map()


这里关于jQuery,map()就讲到这里了。以下是.map()函数,上面说了这个函数是提供给jQuery对象用的,详细怎么使用呢?

一个常见的需求,比方我们使用了一个对话框来提供一组checkbox,那么当选完之后须要将结果放入原界面,这个时候就须要得到所选的对象了

    <div>
青菜豆腐
<input type="checkbox" value="1" name="dishes">
</div>
<div>
酸辣土豆丝
<input type="checkbox" value="2" name="dishes">
</div>
<div>
红烧鲫鱼
<input type="checkbox" value="3" name="dishes">
</div>
<div>
辣子鸡
<input type="checkbox" value="4" name="dishes">
</div>
<script>
$(function(){
var ids = $(':checkbox:checked').map(function() {
return this.value;
}).get().join();
$('#dishes').val(ids); // 将选中的dishes保存到表单
})
</script>

当中函数的核心思想还是一样的。详细多用就会得心应手了!

map()函数的Java实现

体会到map()函数的方便了吧?在Java中也好像使用这个方案啊,只是找遍Java API也没有提供类似的工具方法

那么就响应毛主席的号召,“自己动手,丰衣足食”吧,呵呵~

详细代码例如以下:

	public static String map(Collection<?> c, String fieldName) {
Field field = null;
if (CollectionUtils.isNotEmpty(c)) {
Class<?> clazz = c.iterator().next().getClass();
try {
field = clazz.getDeclaredField(fieldName);
field.setAccessible(true);
String str = "";
for (Object object : c) {
Object val = field.get(object);
if(val != null){
str += "," + val.toString();
}
}
if(isBlank(str)){
return null;
}
return str.substring(1);
} catch (Exception e) {
System.out.println("fieldName填写有误,该成员变量不存在");
}
}
return null;
}

只是这种方法可和jQuery的map()还是有非常大差距的。这里仅仅是简单的实现了map()最简单的功能

而无法对获取到的值进行随意的改变。若想实现也能够採用回调接口的方式来做,这里就不再给出代码了,有兴趣的朋友能够试试~

jQuery——map()函数以及它的java实现的更多相关文章

  1. JQuery map()函数

    DOM.map(callback(index,domElement)); 对匹配元素执行函数对象. 返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组. 返回数据类 ...

  2. 学习JQuery中文文档之map()函数和get()函数

    今天学到一个新的函数map(). map(callback) 官方概述: 将一组元素转换成其他数组(不论是否是元素数组) 你可以用这个函数来建立一个列表,不论是值.属性还是CSS样式,或者其他特别形式 ...

  3. JQuery的隐式迭代和each函数和map函数

    1.JQuery选择器选择出来的是一个数组对象,可是给这些每一个元素都要设置内容时,就会隐式迭代,JQuery自己实现内部循环给每个元素绑定上设置. 2.如果是获取的话,那就是默认获取第一个元素的值. ...

  4. [hadoop] map函数中使用FileSystem对象出现java.lang.NullPointerException的原因及解决办法

    问题描述: 在hadoop中处理多个文件,其中每个文件一个map. 我使用的方法为生成一个文件,文件中包含所有要压缩的文件在HDFS上的完整路径.每个map 任务获得一个路径名作为输入. 在eclip ...

  5. jQuery 源码分析(五) map函数 $.map和$.fn.map函数 详解

    $.map() 函数用于使用指定函数处理数组中的每个元素(或对象的每个属性),并将处理结果封装为新的数组返回,该函数有三个参数,如下: elems Array/Object类型 指定的需要处理的数组或 ...

  6. jQuery 遍历函数

    转载http://www.cnblogs.com/tylerdonet/archive/2013/04/05/3000618.html jQuery 遍历函数包括了用于筛选.查找和串联元素的方法. 函 ...

  7. STL : map函数的运用 --- hdu 4941 : Magical Forest

    Magical Forest Time Limit: 24000/12000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Other ...

  8. jQuery 遍历函数(w3school)

    jQuery 遍历函数包括了用于筛选.查找和串联元素的方法.   函数 描述 .add() 将元素添加到匹配元素的集合中. .andSelf() 把堆栈中之前的元素集添加到当前集合中. .childr ...

  9. Jq_Ajax 操作函数跟JQuery 遍历函数跟JQuery数据操作函数

    JQuery文档操作方法 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数                             ...

随机推荐

  1. CSDN高校俱乐部第二届战神杯第二题题解

    两个人玩一个数字游戏,给定两个正整数A,B,两个人轮流从一个数中减去另外一个数的正数倍.要保证结果非负, 首先得到0的人获胜. 比如:30 8经过一步操作能够变为22 8 或者14 8 或者 6 8. ...

  2. 切换JDK版本quick

    最近遇到一个小问题,同时做两个项目,jdk版本一个是5,一个是6,我也去网上找了找方法,但是感觉不是特别好用,最后自己通过一些环境变量设置的技巧和一些批处理命令来使得这件事情只需要双击,输入一个数字回 ...

  3. SpringMVC+uploadify3.2.1版实现附件上传功能(直接可以使用)

    <link rel="stylesheet" type="text/css" href='<c:url value="/uploadify ...

  4. c#初学12-12-为什么mian函数必须是static的

    c#初学12-12-为什么mian函数必须是static的 c#程序刚开始启动的时候都会有唯一一个入口函数main()函数, 而非静态成员又称实例成员,必须作用于实例.在程序刚开始运行的时候,未建立任 ...

  5. uni-app 自定义扫码界面

    二维码扫描,已经成为当下一款应用不可或缺,同时也是用户习以为常的功能了.uni-app 为我们提供了扫码 API ,直接调用即可. 需求场景 在实际开发中,平台提供的默认扫码界面,并不能满足一些自定义 ...

  6. shell编程-1.字符截取命令-列截取awk+printf

  7. ONGUI->NGUI->UGUI (Unity UI史)

    各GUI的介绍 ONGUI:Unity自带的绘制界面工具,它的成像原理是基于表层的,所以执行效率非常的低,并且没有提供复杂的UI的接口,就算开发者硬着头皮写上去只能让UI的执行效率更低. NGUI:第 ...

  8. Pyhton学习——Day50

    #HTTP协议# 又是转载:http://www.cnblogs.com/yuanchenqi/articles/6000358.html# 一 HTTP概述# HTTP(hypertext tran ...

  9. 8、Collaborative Metric Learning

    一.摘要: 文章的核心思想:是如何把Metric learning 和 CF结合起来从而达到更好的推荐效果. 提出了CML(Collaborative Metric Learning),其学习一个联合 ...

  10. 用于构建 RESTful Web 服务的多层架构

    作者:Bruce Sun, Java 架构师, IBM 出处:http://www.ibm.com/developerworks/cn/web/wa-aj-multitier/ 用于构建 RESTfu ...