jquery中map函数与each函数的区别实例介绍


Posted in Javascript onJune 23, 2014

​jquery中的each函数和map函数的用法看起来差不多,但其实还是有一点区别的。

​其中一个重要的区别是,each返回的是原来的数组,并不会新创建一个数组。而map方法会返回一个新的数组。如果在没有必要的情况下使用map,则有可能造成内存浪费。

​例如:

var items = [1,2,3,4]; 
$.each(items, function() { 
alert('this is ' + this); 
}); 
var newItems = $.map(items, function(i) { 
return i + 1; 
}); 
// newItems is [2,3,4,5]

​使用each时,改变的还是原来的items数组,而使用map时,不改变items,只是新建一个新的数组。

​例如:

var items = [0,1,2,3,4,5,6,7,8,9]; 
var itemsLessThanEqualFive = $.map(items, function(i) { 
// removes all items > 5 
if (i > 5) 
return null; 
return i; 
}); 
// itemsLessThanEqualFive = [0,1,2,3,4,5]

当需要对数组进行删除时也是如此,所以删除时错误使用each或map后果还是蛮严重的。

Javascript 相关文章推荐
javascript自定义的addClass()方法
May 28 Javascript
js判断移动端是否安装某款app的多种方法
Dec 18 Javascript
JS加载iFrame出现空白问题的解决办法
May 13 Javascript
WEB前端开发框架Bootstrap3 VS Foundation5
May 16 Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
Oct 10 Javascript
原生js实现水平方向无缝滚动
Jan 10 Javascript
详解vue与后端数据交互(ajax):vue-resource
Mar 16 Javascript
JavaScript中 ES6变量的结构赋值
Jul 10 Javascript
JS编写兼容IE6,7,8浏览器无缝自动轮播
Oct 12 Javascript
微信小程序实现打卡日历功能
Sep 21 Javascript
微信小程序使用Vant Weapp组件库的方法步骤
Aug 01 Javascript
浅谈vue权限管理实现及流程
Apr 23 Javascript
jQuery学习笔记之 Ajax操作篇(二) - 数据传递
Jun 23 #Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
Jun 23 #Javascript
jquery让返回的内容显示在特定div里(代码少而精悍)
Jun 23 #Javascript
yepnope.js使用详解及示例分享
Jun 23 #Javascript
js的延迟执行问题分析
Jun 23 #Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
Jun 23 #Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 #Javascript
You might like
PHP个人网站架设连环讲(一)
2006/10/09 PHP
PHP文件生成的图片无法使用CDN缓存的解决方法
2015/06/20 PHP
PHP处理CSV表格文件的常用操作方法总结
2016/07/01 PHP
php tpl模板引擎定义与使用示例
2019/08/09 PHP
比较简单的一个符合web标准的JS调用flash方法
2007/11/29 Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
struts2+jquery+json实现异步加载数据(自写)
2013/06/24 Javascript
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
2015/08/26 Javascript
javascript数据结构之双链表插入排序实例详解
2015/11/25 Javascript
jQuery+ajax简单实现文件上传的方法
2016/06/03 Javascript
Bootstrap Multiselect 常用组件实现代码
2017/07/09 Javascript
Gulp实现静态网页模块化的方法详解
2018/01/09 Javascript
vue 子组件向父组件传值方法
2018/02/26 Javascript
浅谈React高阶组件
2018/03/28 Javascript
微信小程序实现运动步数排行功能(可删除)
2018/07/05 Javascript
详解Node.js读写中文内容文件操作
2018/10/10 Javascript
vue使用代理解决请求跨域问题详解
2019/07/24 Javascript
vue数据更新UI不刷新显示的解决办法
2020/08/06 Javascript
Python实现截取PDF文件中的几页代码实例
2019/03/11 Python
对PyQt5基本窗口控件 QMainWindow的使用详解
2019/06/19 Python
浅谈Python中函数的定义及其调用方法
2019/07/19 Python
python raise的基本使用
2020/09/10 Python
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
美国电力供应商店/电气批发商:USESI
2018/10/12 全球购物
通用C#笔试题附答案
2016/11/26 面试题
Set里的元素是不能重复的,那么用什么方法来区分重复与否呢? 是用==还是equals()? 它们有何区别?
2014/07/27 面试题
建材业务员岗位职责
2013/12/08 职场文书
安全生产投入制度
2014/01/29 职场文书
宗教学大学生职业生涯规划范文
2014/02/08 职场文书
教师党员个人整改措施材料
2014/09/16 职场文书
加强作风建设演讲稿
2014/10/24 职场文书
群众路线教育实践活动实施方案
2014/10/31 职场文书
2014年公务员工作总结
2014/11/18 职场文书
公司周年庆寄语
2019/06/21 职场文书
Python面向对象编程之类的概念
2021/11/01 Python
Java由浅入深通关抽象类与接口(上篇)
2022/04/26 Java/Android