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 相关文章推荐
JQuery 图片的展开和伸缩实例讲解
Apr 18 Javascript
Jquery为a标签的href赋值实现代码
May 03 Javascript
提取jquery的ready()方法单独使用示例
Mar 25 Javascript
js简单实现标签云效果实例
Aug 06 Javascript
javascript跑马灯抽奖实例讲解
Apr 17 Javascript
AngularJS变量及过滤器Filter用法分析
Nov 22 Javascript
JS+DIV实现的卷帘效果示例
Mar 22 Javascript
使用canvas及js简单生成验证码方法
Apr 02 Javascript
图片懒加载imgLazyLoading.js使用详解
Sep 15 Javascript
微信小程序实现上传图片功能
May 28 Javascript
Vue中对iframe实现keep alive无刷新的方法
Jul 23 Javascript
HTML+VUE分页实现炫酷物联网大屏功能
May 27 Vue.js
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
escape unescape的php下的实现方法
2007/04/27 PHP
Discuz板块横排显示图片的实现方法
2007/05/28 PHP
一款简单实用的php操作mysql数据库类
2014/12/08 PHP
Zend Framework入门教程之Zend_Config组件用法详解
2016/12/09 PHP
基于php(Thinkphp)+jquery 实现ajax多选反选不选删除数据功能
2017/02/24 PHP
通过JS自动隐藏手机浏览器的地址栏实现原理与代码
2013/01/02 Javascript
JS分页效果示例
2013/10/11 Javascript
node.js中的socket.io入门实例
2014/04/26 Javascript
JS面向对象基础讲解(工厂模式、构造函数模式、原型模式、混合模式、动态原型模式)
2014/08/16 Javascript
JavaScript fontcolor方法入门实例(按照指定的颜色来显示字符串)
2014/10/17 Javascript
node.js中watch机制详解
2014/11/17 Javascript
ExtJs动态生成treepanel的Json格式
2015/07/19 Javascript
js HTML5 Canvas绘制转盘抽奖
2020/09/13 Javascript
jQuery中table数据的值拷贝和拆分
2017/03/19 Javascript
bootstrap timepicker在angular中取值并转化为时间戳
2017/06/13 Javascript
微信小程序之页面跳转和参数传递的实现
2017/09/29 Javascript
node基于puppeteer模拟登录抓取页面的实现
2018/05/09 Javascript
浅谈如何使用webpack构建多页面应用
2018/05/30 Javascript
Vue登录主页动态背景短视频制作
2019/09/21 Javascript
[14:03]2017DOTA2亚洲邀请赛开幕式:12神兵演绎水墨中华
2017/04/01 DOTA
在Django框架中伪造捕捉到的URLconf值的方法
2015/07/18 Python
Python实现递归遍历文件夹并删除文件
2016/04/18 Python
python打包exe开机自动启动的实例(windows)
2019/06/28 Python
jupyter lab的目录调整及设置默认浏览器为chrome的方法
2020/04/10 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
构造方法和其他方法的区别
2016/04/26 面试题
成考报名单位证明范本
2014/01/16 职场文书
保密普查工作实施方案
2014/02/25 职场文书
各营销点岗位职责范本
2014/03/05 职场文书
社区服务活动总结
2014/05/07 职场文书
关爱留守儿童捐款倡议书
2015/04/27 职场文书
反腐倡廉观后感
2015/06/08 职场文书
CSS变量实现主题切换的方法
2021/06/23 HTML / CSS
德劲DE1102数字调谐收音机机评
2022/04/07 无线电
避坑之 JavaScript 中的toFixed()和正则表达式
2022/04/19 Javascript
Vue OpenLayer 为地图绘制风场效果
2022/04/24 Vue.js