遍历应该是各种语言中常会用到的操作了,实现的方法也很多,例如使用for、while等循环语句就可以很轻松的做到对数组或对象的遍历,今天想讲的不是它们,而是简单方便的遍历方法。

  大致的整理了一下,经常用到的大概有Jquery的$.each、$.map、each()、map()、get()、toArray()以及js原生的forEach()吧,当然肯定还有一些我不知道的,今天就先谈谈$.each()和$.map()区别。

$.each()

$.each()方法可用于遍历任何对象(包括数组),结构为:$.each(array/object,function(index/key,value){ code })。index指遍历对象成员的索引,value指成员的内容。如果需要退出循环可使回调函数返回 false,其它返回值将被忽略。

上栗子:

//遍历数组
$(function(){
var arr = ["a","b","c","d"];
$.each(arr,function(index,value){
console.log(value+" "+index);
});
});
结果依次输出
a0
b1
c2
d3 如果你在循环中放入console.log(this),结果会依次输出string{a}。。。也就是表明返回值为对象。 //遍历对象
$(function(){
var obj = {name:"tony",age:18,job:"adc"}
$.each(obj,function(key,value){
console.log(key+" "+value);
});
});
结果依次输出
name tony
age 18
job adc

$.map()

$.map()方法可以在遍历数组或对象成员的同时,经过回调函数的调用,然后转换到另一个新的数组中(这也是和$.each()的最大区别)。

结构:$.map(array/object,function(value,index/key){ code }),index指遍历对象成员的索引,value指成员的内容。如果需要退出循环可使回调函数返回 false,其它返回值将被忽略。

看栗子:

//遍历数组
$(function(){
var arr = ["a","b","c","d"];
var arr1 = $.map(arr,function(value,index){ //注意回调函数的参数位置和$.each()的不一致
console.log(index+value);
var val = value.toUpperCase();//可以在回调函数中对成员进行操作,然后将其返回到新的数组中。toUpperCase()方法转换字符为大写。
return val;//一定要使用return返回值,否则新数组接受不到
});
console.log(arr1);
 var res = Object.prototype.toString.call(obj1);//使用Object.prototype.toString.call()方法返回传入变量的类型
 console.log(res);
});
首先依次输出遍历的结果
a0
b1
c2
d3
输出arr1的结果(可以看出是返回值组成的新数组)
[A,B,C,D]
输出res结果为
Object Array (遍历对象可以参照$.each()方法,只不过返回的仍然是数组)

在这里有的同学可能就会疑问$.each()是否也会生成新的数组,眼见为实:

继续栗子:

$(function(){
var arr = ["a","b","c","d"];
var arr1 = $.each(arr,function(index,value){
var val = value.toUpperCase();
return val;
});
console.log(arr1);
});
/*输出的结果仍然为
[a,b,c,d]
所以说明返回的只是原数组,而不是生成新数组*/

随机推荐

  1. java.lang.UnsatisfiedLinkError:dlopen failed: “**/*/arm/*.so” has unexpected e_machine: 3

    转载请标明出处,维权必究:https://www.cnblogs.com/tangZH/p/10458448.html 今天在做APP的时候使用so库,可结果一加载so库的时候便发生了这个莫名其妙的错 ...

  2. Windows Server 2016-Netdom Join加域并指定OU (一)

    前边我们提到了客户端如何通过图形化.netdom .Powershell方式加域,这里我们简单补充下生产环境中如何通过有权限的用户账号加域并指定对应的OU,以防止域策略下发对部分生产服务器权限等内容进 ...

  3. SQLServer之删除用户自定义数据库用户

    删除用户自定义数据库用户注意事项 不能从数据库中删除拥有安全对象的用户. 必须先删除或转移安全对象的所有权,才能删除拥有这些安全对象的数据库用户. 不能删除 guest 用户,但可在除 master ...

  4. v-cloak的用法和注意事项

    v-cloak是前端框架vue.js中的一个方法,作用是为了防止在页面加载时先出现变量名闪烁的情况,造成不好的用户体验, 例如:{{ v.name}} (闪一下)=> 张三 用法:html中:& ...

  5. Adobe系列产品卸载不干净怎么解决

    相信很多朋友都遇到过Adobe系列的产品卸载不干净这种问题,究竟如何来解决这个难题呢? Adobe产品在安装的过程中都会自带卸载程序,因此,小编建议各位不要用其他的卸载清理软件来卸载,这样往往会导致卸 ...

  6. 我们为什么要搞长沙.NET技术社区(4)

    我们为什么要搞长沙.NET技术社区(4) 邹溪源,2019年3月7日 Ps:文中的.NET 包括且不限定于传统.NET Framework技术和.NET Core技术. 1.    楔子 昨天(201 ...

  7. springcloud之自定义简易消费服务组件

    本次和大家分享的是怎么来消费服务,上篇文章讲了使用Feign来消费,本篇来使用rest+ribbon消费服务,并且通过轮询方式来自定义了个简易消费组件,本文分享的宗旨是:自定义消费服务的思路:思路如果 ...

  8. 远程window服务器,无法复制粘贴了

    1.先检查本机 2.检查服务器 win+R打开输入taskmgr 找到这个进程,结束进程 3.在win+r打开输入rdpclip确认启动,发现可以复制粘贴了.

  9. 如何机智判断页面是刷新还是关闭,背景:vue项目,需求:关闭页面,下次直接跳到登陆页

    最近项目有这么个需求:要在关闭当前系统的窗口的时候,退出登录, 因为如果不退出登录可能存在安全风险,其实我想说,电脑没事别借给别人活着离开工位记得一定要锁屏,其实我们设置了cookie失效时间的,过了 ...

  10. Python:SQLMap源码精读—基于时间的盲注(time-based blind)

    建议阅读 Time-Based Blind SQL Injection Attacks 基于时间的盲注(time-based blind) 测试应用是否存在SQL注入漏洞时,经常发现某一潜在的漏洞难以 ...