jQuery中each和js中forEach的区别分析


Posted in jQuery onFebruary 27, 2019

本文实例讲述了jQuery中each和js中forEach的区别。分享给大家供大家参考,具体如下:

<script>
  $(function(){
    // 3.1遍历数组
    var arr = [1, 3, 5, 7, 9];
    // 3.1.1通过原生方法遍历数组
    // 第一个回调函数参数是遍历到的元素
    // 第二个回调函数参数是当前遍历的索引
    // 返回值:没有返回值
    var res = arr.forEach(function(ele, idx){
      console.log(idx, ele);
    });
    console.log(res);
    // 3.1.2通过jQuery静态方法遍历数组
    // 第一个回调函数参数是当前遍历的索引
    // 第二个回调函数参数是遍历到的元素
    // 返回值:被遍历的数组
    var $res2 = $.each(arr, function(idx, ele){
      console.log(idx, ele);
    });
    console.log($res2);
    // 3.2遍历对象
    var obj = {name:"lnj",age:"33",gender:"male"};
    // 3.2.1 js对象没有forEach方法,所以通过for in方法遍历对象
    for(var key in obj){
      console.log(key, obj[key]);
    }
    // 3.2.2 通过jQuery静态方法遍历对象
    $.each(obj,function(key, value){
      console.log(key, value);
    });
  });
</script>

总结:

1.在遍历数组时:

回调函数中参数的位置不一样,forEach中为第一个参数为ele,第二个为index。each中第一个为index,第二个为ele;

回调函数中是否有返回值,forEach中没有返回值,each有返回值,返回被遍历的数组

2.遍历对象

forEach不能遍历对象,可以使用for in;

而each可以通过jq的讲台方法来遍历,即$.each(obj,function(key,value){})

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

jQuery 相关文章推荐
jQuery编写textarea输入字数限制代码
Mar 23 jQuery
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
jquery.uploadifive插件怎么解决上传限制图片或文件大小问题
May 08 jQuery
最常用的jQuery表单验证(简单)
May 23 jQuery
使用jquery+iframe做一个ajax上传效果(实例)
Aug 24 jQuery
通过jquery toggleClass()属性制作文章段落更改背景颜色
May 21 jQuery
jQuery实现的点击按钮改变样式功能示例
Jul 21 jQuery
详解jQuery获取特殊属性的值以及设置内容
Nov 14 jQuery
jQuery动态操作表单示例【基于table表格】
Dec 06 jQuery
jquery.pager.js实现分页效果
Jul 29 jQuery
jquery实现进度条状态展示
Mar 26 jQuery
html5以及jQuery实现本地图片上传前的预览代码实例讲解
Mar 01 jQuery
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 #jQuery
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
Feb 27 #jQuery
jQuery表单元素过滤选择器用法实例分析
Feb 20 #jQuery
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 #jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 #jQuery
jQuery选择器之层次选择器用法实例分析
Feb 19 #jQuery
jQuery选择器之基本选择器用法实例分析
Feb 19 #jQuery
You might like
Discuz! Passport 通行证整合
2008/03/27 PHP
php获取客户端电脑屏幕参数的方法
2015/01/09 PHP
php字符串操作针对负值的判断分析
2016/07/28 PHP
thinkPHP5 tablib标签库自定义方法详解
2017/05/10 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
jquery imgareaselect 使用利用js与程序结合实现图片剪切
2009/07/30 Javascript
jquery焦点图片切换(数字标注/手动/自动播放/横向滚动)
2013/01/24 Javascript
jQuery实现动画效果的简单实例
2014/01/27 Javascript
Node.js中创建和管理外部进程详解
2014/08/16 Javascript
Jquery中$.post和$.ajax的用法小结
2015/04/28 Javascript
javascript中$(function() {});写与不写有哪些区别
2015/08/10 Javascript
JavaScript实现向右伸出的多级网页菜单效果
2015/08/25 Javascript
js+css实现select的美化效果
2016/03/24 Javascript
微信小程序 地图map实例详解
2017/06/07 Javascript
微信小程序后台解密用户数据实例详解
2017/06/28 Javascript
vue.js element-ui tree树形控件改iview的方法
2018/03/29 Javascript
vue+element-ui集成随机验证码+用户名+密码的form表单验证功能
2018/08/05 Javascript
详解vuex之store源码简单解析
2019/06/13 Javascript
vue.js 实现a标签href里添加参数
2019/11/12 Javascript
vue递归获取父元素的元素实例
2020/08/07 Javascript
[55:25]2018DOTA2亚洲邀请赛3月29日 小组赛A组 VG VS OG
2018/03/30 DOTA
python Django批量导入不重复数据
2016/03/25 Python
python 已知三条边求三角形的角度案例
2020/04/12 Python
pytorch 多分类问题,计算百分比操作
2020/07/09 Python
Python 使用Opencv实现目标检测与识别的示例代码
2020/09/08 Python
python中pow函数用法及功能说明
2020/12/04 Python
一款基于css3的列表toggle特效实例教程
2015/01/04 HTML / CSS
英国二手iPhone、音乐、电影和游戏商店:musicMagpie
2018/10/26 全球购物
欧缇丽加拿大官方网站:Caudalie加拿大
2019/07/18 全球购物
村级环境卫生整治方案
2014/05/04 职场文书
教师节演讲稿
2014/05/06 职场文书
大学新生军训自我鉴定
2014/09/18 职场文书
一份没有按时交货失信于客户的检讨书
2014/09/19 职场文书
后进生评语大全
2015/01/04 职场文书
spring cloud 配置中心客户端启动遇到的问题
2021/09/25 Java/Android
如何Tomcat中使用ipv6地址
2022/05/06 Servers