each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象、数组的属性值并进行处理。

jQuery和jQuery对象都实现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用。而jQuery对象提供的each方法则是对jQuery内部的子元素进行逐个调用。
jQuery.prototype.each=function( fn, args ) {
return jQuery.each( this, fn, args );
}

让我们看一下jQuery提供的each方法的具体实现,
jQuery.each(obj,fn,arg)
该方法有三个参数:进行操作的对象obj,进行操作的函数fn,函数的参数args。
让我们根据ojb对象进行讨论:

1.obj对象是数组 
each方法会对数组中子元素的逐个进行fn函数调用,直至调用某个子元素返回的结果为false为止,也就是说,我们可以在提供的fn函数进行处理,使之满足一定条件后就退出each方法调用。当each方法提供了arg参数时,fn函数调用传入的参数为arg,否则为:子元素索引,子元素本身 
2.obj 对象不是数组 
该方法同1的最大区别是:fn方法会被逐次不考虑返回值的进行进行。换句话说,obj对象的所有属性都会被fn方法进行调用,即使fn函数返回false。调用传入的参数同1类似。

//   jQuery中each方法
each=function( obj, fn, args ) {
if ( args ) {
if ( obj.length == undefined ){
for ( var i in obj )
fn.apply( obj, args );
}else{
for ( var i = 0, ol = obj.length; i < ol; i++ ) {
if ( fn.apply( obj, args ) === false )
break; } }
} else {
if ( obj.length == undefined ) {
for ( var i in obj )
fn.call( obj, i, obj );
}else{
for ( var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val,i,val) !== false; val = obj[++i] ){} }
}
return obj;
}
// 测试用例
var arr = ['001','002','003','004','005'];
var obj = {name : "finder"};
var obj2 = {name : "liubei"};
var isMe = function (numone, numtwo, numthree, numfour, numfive) {
console.log("I'm " + numone +","+ numtwo +"," + numthree +","+ numfour +"," + numfive);
};
var lookMe = function (index, ob) {
console.log(index + ":" + ob[index]);
};
each(arr, isMe, arr);
each(arr, isMe);
each(obj, lookMe);
each(obj2, lookMe);

需要特别注意的是each方法中fn的具体调用方法并不是采用简单的fn(i,val)或fn(args),而是采用了fn.call(val,i,val)或fn.apply(obj.args)的形式,这意味着,在你自己的fn的实现中,可以直接采用this指针引用数组或是对象的子元素。这种方式是绝大多数jQuery所采用的一种实现方式。

详细图示:

参考文章:http://www.cnblogs.com/silence516/articles/1397209.html

JQuery中each方法实现的更多相关文章

  1. jQuery中eq()方法用法实例

    本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...

  2. 深度理解Jquery 中 offset() 方法

    参考原文:深度理解Jquery 中 offset() 方法

  3. jQuery中attr()方法用法实例

    本文实例讲述了jQuery中attr()方法用法.分享给大家供大家参考.具体分析如下: 此方法设置或返回匹配元素的属性值. attr()方法根据参数的不同,功能也不同. 语法结构一: 获取第一个匹配元 ...

  4. 使用jquery中height()方法获取各种高度大全

    alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(docum ...

  5. 锋利的jQuery读书笔记---jQuery中Ajax--load方法

    第一个Ajax例子 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...

  6. 关于Jquery中ajax方法data参数用法的总结

    data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...

  7. jquery中Live方法不可用,Jquery中Live方法失效

    jquery中Live方法不可用,Jquery中Live方法失效 >>>>>>>>>>>>>>>>> ...

  8. jQuery中on()方法用法实例详解

    这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能及各种常见的使用技巧,并对比分析了与bind(),live(),delegate()等方法的区别,需要的朋友可以参考下 本 ...

  9. jQuery中的方法

    jQuery中的方法来操作HTML标签中的属性 attr(name)    获取当前对象的指定的属性的值 attr(key,value)  给当前对象设置属性值 attr(properties)  一 ...

  10. 解析jQuery中extend方法--源码解析以及递归的过程《二》

    源码解析 在解析代码之前,首先要了解extend函数要解决什么问题,以及传入不同的参数,会达到怎样的效果.extend函数内部处理传入的不同参数,返回处理后的对象. extend函数用来扩展对象,增加 ...

随机推荐

  1. android软件开发之TextView控件常用属性

    TextView控件 text属性,设置显示的文本 textColor:设置文本颜色 textSize:设置文本字体大小 autoLink:设置文本为电话,URL连接等的时候是否显示为可点击的链接 c ...

  2. Vue--- 一点车项目 连接数据库 数据使用

    Vue--- 一点车项目  连接数据库 数据使用 后台服务器 返回数据 处理 created 这个钩子在实例被创建之后被调用: async created(){ // 分类 catelist { le ...

  3. Hibernate一级缓存和三种状态

    Hibernate一级缓存又称session缓存,生命周期很短,跟session生命周期相同. 三种状态:1.transient(瞬时态):刚new出来的对象,既不在数据库中,也不在session管理 ...

  4. 给出一个整数,将这个整数中每位上的数字进行反转(JavaScript编程)

    一.问题描述:给出一个整数,将这个整数中每位上的数字进行反转.示例:输入:123,输出321:输入-123,输出-321:输入120,输出-21 二.问题分析与解决: 需要将给出的整数反转,注意示例中 ...

  5. Redis(八):Redis的复制(Master/Slave)

    Redis的复制(Master/Slave)目录导航: 是什么 能干嘛 怎么玩 复制原理 哨兵模式(sentinel) 复制的缺点 是什么 官网 行话:也就是我们所说的主从复制,主机数据更新后根据配置 ...

  6. mysql8.0.11的坑早知道

    1.plugin caching_sha2_password could not be loaded 我在mac上用Sequel Pro连数据库的时候,会报出以上错误,这是应为8.0.11把身份认证插 ...

  7. MongoDB如何释放空闲空间?

    当我们从MongoDB中删除文档或集合时,MongoDB并不会将已经占用了的磁盘空间释放,它会一直维护已经占用了磁盘空间的数据文件,尽管数据文件中可能存在大大小小的空记录列表(empty record ...

  8. QQ空间认证之数据篇

    最近,我们发现可以利用开通企鹅媒体平台的方式开通QQ公众号从而绑定我们的QQ号,这样我们所绑定的QQ号就成了认证空间了. 虽说这样很快捷的就认证了我们的QQ空间,但是,起有利也有弊.任何事情都不是十全 ...

  9. Julia 1.0 中文文档

    欢迎来到Julia 1.0的文档. 请阅读发布博客文章,了解该语言的一般概述以及自Julia v0.6以来的许多更改.请注意,0.7版本与1.0一起发布,以提供1.0版本之前的软件包和代码的升级路径. ...

  10. 插入排序,C语言实现

    插入排序是稳定排序,时间复杂度最低为O(n),最高为O(n^2),平均为O(n^2). 插入排序是将数组分为两部分,一部分已经排好序,另一部分未排好序,每次从未排好序的部分取第一个元素插入到已经排好序 ...