JQuery中each方法实现
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方法实现的更多相关文章
- jQuery中eq()方法用法实例
本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...
- 深度理解Jquery 中 offset() 方法
参考原文:深度理解Jquery 中 offset() 方法
- jQuery中attr()方法用法实例
本文实例讲述了jQuery中attr()方法用法.分享给大家供大家参考.具体分析如下: 此方法设置或返回匹配元素的属性值. attr()方法根据参数的不同,功能也不同. 语法结构一: 获取第一个匹配元 ...
- 使用jquery中height()方法获取各种高度大全
alert($(window).height()); //浏览器当前窗口可视区域高度 alert($(document).height()); //浏览器当前窗口文档的高度 alert($(docum ...
- 锋利的jQuery读书笔记---jQuery中Ajax--load方法
第一个Ajax例子 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...
- 关于Jquery中ajax方法data参数用法的总结
data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...
- jquery中Live方法不可用,Jquery中Live方法失效
jquery中Live方法不可用,Jquery中Live方法失效 >>>>>>>>>>>>>>>>> ...
- jQuery中on()方法用法实例详解
这篇文章主要介绍了jQuery中on()方法用法,实例分析了on()方法的功能及各种常见的使用技巧,并对比分析了与bind(),live(),delegate()等方法的区别,需要的朋友可以参考下 本 ...
- jQuery中的方法
jQuery中的方法来操作HTML标签中的属性 attr(name) 获取当前对象的指定的属性的值 attr(key,value) 给当前对象设置属性值 attr(properties) 一 ...
- 解析jQuery中extend方法--源码解析以及递归的过程《二》
源码解析 在解析代码之前,首先要了解extend函数要解决什么问题,以及传入不同的参数,会达到怎样的效果.extend函数内部处理传入的不同参数,返回处理后的对象. extend函数用来扩展对象,增加 ...
随机推荐
- Spring + Mybatis应该如何配置
### 1. MYBATIS简介 MYBATIS是持久层框架,大大的简化了持久层开发. 当使用MYBATIS框架时,开发人员不必再编写繁琐的JDBC代码,只需要定义好每个功能对应的抽象方法与需要执行的 ...
- IDEA一直提示 错误: 找不到或无法加载主类
1.把http://repo1.maven.org/maven2...下载下来2.放到本地Manen仓库archetype 文件夹下3.设置IDEA Maven->Runner 界面的VM Op ...
- LAMP+Varnish的实现
基于Keepalived+Varnish+Nginx实现的高可用LAMP架构 注意:各节点的时间需要同步(ntpdate ntp1.aliyun.com),关闭firewalld(systemctl ...
- VirtualBox复制的虚拟机无法获取IP解决办法
自从建立了这个账号后写了一篇,好几年没来了,今天来看看,顺便分享一下. 昨天晚上想玩玩zookeeper集群,在vb里复制了一台主机,可怎么也无法获取IP,经研究,终于还是解决了. 1.复制主机时勾选 ...
- vi模式下的编辑、删除、保存和退出
vi + 文件名:进入 vi 模式 编辑模式:shift+: 退出编辑模式:Esc 退出编辑模式后可进行光标的上下左右移动(偶尔会出现ABCD,还不知道怎么解决,目前只能出来一个删除一个) 光标处:按 ...
- tp3.2源码解析——入口文件
如果有人读这篇文章并跟着做的话,希望你能使用支持函数跳转的编辑器,还要善用var_dump和exit,对着源码去调试着看.跟着入口文件读,执行到哪里你看到哪里,对于那些不能一眼看出来的配置,则要记录下 ...
- 3.1 wifi网卡RT3070在S3C2440的移植和使用
学习目标:熟悉RT3070在S3C2440的移植和使用,以及其中的相关工具的安装和使用: 一.配置内核选择WIFI驱动 1. 将usb wifi插到电脑,在ubuntu使用命令:# lsusb 查看w ...
- S3C2440启动程序运行过程
s3c2440有两种启动方式,一种Nor flash 启动,一种Nand flash 启动. 由于NAND FLASH是接在NAND FLASH控制器上而不是系统总线上,所以没有在S3C2440A的8 ...
- Python学习:9.模块的安装以及调用模块
什么是模块 在Python中,模块其实也就是包含python代码的文件,我们为什么要使用模块?在我们以后写代码的时候,我们会发现有很多功能需要经常使用,那我们想要使用这些功能怎么办,要再把那些代码在敲 ...
- vim 版本更新
sudo add-apt-repository ppa:jonathonf/vim sudo apt update sudo apt install vim 如果您想要卸载它, 请使用如下命令 sud ...