var arr = ["aa","bb","{name:apple}"];

1.each的使用

var a = $.each(arr,function(index,value){

  console.log(this.toString()+"---->>");//结果为aa---->>  //bb---->>  //{name:apple}---->

})

console.log(a);//a的结果为aa,bb,{name:apple}

2.map的使用

var b = $.map(arr,function(value,index){

  return value ="ff";//map中没有this

})

console.log(b);//b的结果为ff,ff,ff

3.grep的使用

var c = $.grep(arr,function(value,index){

  //return value.indexOf("a")>=0//grep中没有this

  return value="ff"

})

3.1 console.log(c);//c的结果为aa,{name:apple};

3.2 console.log(c);//c的结果为aa,bb,{name:apple};

总结:

1.回调函数的参数的顺序的不同,

  1.1each是(i,v)

  1.2map和grep是(v,i)

2.返回值得不同

  2.1map是返回一个新的数组

  2.2each和grep还是原来的,但是grep可以返回选取数组的子集

3.是否有当前迭代对象this

  3.1each有

  3.2map和grep没有

each()在数组中的每个元素都调用别的函数时很有用

map()在更改数组中的所有原始值时很有用

grep()在选取数组的子集时很有用

 <!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<link rel="stylesheet" href="style/style.css">
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
var a = ["12", "23", "34"];
var b = ["12", "14", "23"];
var c = $("div");
var each1 = $.each(a, function () {
var x = this//$(this)-->当前迭代对象(有this)
console.log($(this) + "----each1");
})
var each2 = $.each(c, function () {
var x = this//$(this)-->当前迭代对象(有this)
console.log($(this) + "----each2");
})
//不能这么用
//var each3 = a.each(function () {
//})
var each4 = c.each(function () {
var x = this//$(this)-->当前迭代对象(有this)
console.log($(this) + "----each4");
})
var map1 = $.map(c, function () {
var z = this //$(this)-->window
console.log($(this) + "--1--map1");
});
var map2 = $.map(a, function () {
var z = this//$(this)-->window
console.log($(this) + "--2--map2");
});
var map3 = a.map(function () {
var x = this//$(this)-->window
console.log($(this) + "--3-map3");
});
var map4 = c.map(function () {
var x = this//$(this)-->当前迭代对象(有this)
console.log($(this) + "--4--map4");
});
var grep1 = $.grep(a, function () {
var c = this//$(this)-->window
console.log($(this) + "----grep1");
})
var grep2 = $.grep(c, function () {
var c = this//$(this)-->window
console.log($(this) + "----grep2");
})
//不能这样使用
//var grep4 = c.grep(function () {
//})
})
</script>
</head>
<body>
<div class="border-box">1</div>
<div class="padding-box">2</div>
<div class="content-box">3</div>
<div class="solarLeft"> 4</div>
</body>
</html>

each,map,grep的区别的更多相关文章

  1. Java中Set Map List 的区别

    java中set map list的区别: 都是集合接口 简要说明 set --其中的值不允许重复,无序的数据结构 list   --其中的值允许重复,因为其为有序的数据结构 map--成对的数据结构 ...

  2. Collection List Set和Map用法与区别

    labels:Collection List Set和Map用法与区别 java 散列表 集合 Collection           接 口的接口      对 象的集合   ├   List   ...

  3. every();some();filter();map();forEach()各自区别:

    every();some();filter();map();forEach()各自区别: (1)every()方法:(返回值为boolean类型) 对数组每一项都执行测试函数,知道获得对指定的函数返回 ...

  4. lodash 集合处理方法 map和filter区别

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...

  5. Python【day 14】sorted函数、filter函数和map函数的区别

    sorted函数.filter函数和map函数的区别1.作用 前者用于排序, 中者用于筛选, 后者用于返回值(不是特定的筛选或者排序)2.写法 前者 sorted(iterable,key=自定义函数 ...

  6. STL中vector、list、map、set区别(转载)

    list封装了链表,vector封装了数组, list和vector得最主要的区别在于vector使用连续内存存储的,他支持[]运算符,而list是以链表形式实现的,不支持[].vector对于随机访 ...

  7. List,Set,Map用法以及区别

    List,Set,Map是否继承自Collection接口? 答:List,Set是,Map不是. 如图: Collection ├List │├LinkedList │├ArrayList │└Ve ...

  8. List,Set,Map用法以及区别(转)

    Collection是最基本的集合接口,一个Collection代表一组Object,即Collection的元素.一些Collection允许相同的元素而另一些不行.一些能排序而另一些不行.Java ...

  9. List Set Map用法和区别

    List,Set,Map是否继承自Collection接口? 答:List,Set是,Map不是.如图: Collection ├List │├LinkedList │├ArrayList │└Vec ...

随机推荐

  1. Javascript:DOM动态创建元素实例应用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 新浪微博登陆,获取token

    用WeiboAuthListener获取code 用下面的代码获取token..半成品的sdk真让人捉急. String code = values.getString("code" ...

  3. 一、Solr综述

    什么是Solr搜索 我们经常会用到搜索功能,所以也比较熟悉,这里就简单的介绍一下搜索的原理. 当然只是介绍solr的原理,并不是搜索引擎的原理,那会更复杂. 流程图 这是一个非常简单的流程图: Use ...

  4. [React] React Router: IndexRoute

    IndexRoute allows us to define a default child component to be rendered at a specific route when no ...

  5. ViewPager切换动画PageTransformer使用

    Android从3.0开始,就添加了很多动画,ViewPager当然也不例外,相对于非常平庸的默认切换动画,Google给我们展示了两个动画例子:DepthPageTransformer和ZoomOu ...

  6. 设置开机启动时指定非ROOT用户执行相应的脚本

    [root@MSJTVL-MJSP-A01 sm01]# vim /etc/rc.d/rc.local #!/bin/sh # # This script will be executed *afte ...

  7. mysql数据库的高可用方法总结

    高可用架构对于互联网服务基本是标配,无论是应用服务还是数据库服务都需要做到高可用.虽然互联网服务号称7*24小时不间断服务,但多多少少有一 些时候服务不可用,比如某些时候网页打不开,百度不能搜索或者无 ...

  8. WEB 开发所用的网站

    常用前端手册: http://caniuse.com/ http://www.w3school.com.cn/ http://www.runoob.com/ http://www.css88.com/ ...

  9. Oracle Enterprise Manager快速重建

    我们在使用Oracle时, 可以利用Oracle自带的EM(Enterprise Manager)来更方便的管理我们的数据库.但是有时候我们的em却有时候无法连接,造成这个问题的原因有好多,例如没有正 ...

  10. SignalR2.0开发实例之——私聊

    一.前言 继续上一章的补充,这章介绍使用私聊的功能.主要通过一个方法   Clients.Client(Context.ConnectionId).showMessage(msg); SignalR框 ...