jQuery each的实现与call方法的详细介绍
转载原出处: http://www.f2es.com/jquery-each-intro/
先贴上jquery实现each功能的源代码(把常用的call部分提取出来,为了方便理解,就进行了一定的修改)
// A special, fast, case for the most common use of each function( object, function) { if ( object.length == undefined ) { for ( var name in object ) if ( function.call( object[ name ], name, object[ name ] ) === false ) break; } else for ( var i = 0, length = object.length, value = object[0]; i < length && function.call( value, i, value ) !== false; value = object[++i] ){} }
return object; }
each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象、数组的属性值并进行处理。
jQuery和jQuery对象都实现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法。换句话说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用。而jQuery对象提供的each方法则是对jQuery内部的子元素进行逐个调用。
简单的可以理解为
//当我们使用object.each(function(){..})时,实际是进行的调用是 for(var i = i;i<object.length;i++){ var value = object[i]; //function中的this指向value,传入的参数为object的索引和索引处的值 function.call(value,i,value); }
从each传入的参数说起
object就是调用each方法的对象,function就是每一个object都要执行的方法
在了解each实现之前,我们需要了解这个call方法
应用于:Function 对象 调用一个对象的一个方法,以另一个对象替换当前对象。 call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 参数:thisObj -可选项,将被用作当前对象的对象。 arg1, arg2, , argN -可选项,将被传递方法参数序列。
说明 call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。
简单的例子一个:
function Class1() { this.name = “class1″; //js闭包 this.showName = function() { alert(this.name); } }
function Class2() { this.name = “class2″; } var c1 = new Class1(); var c2 = new Class2(); c1.showName.call(c2);
c1.showName.call(c2)中call方法把c1的方法放到了c2上执行,因为call方法替换的是函数内部this.name = “class2″后执行的方法,也就是说
执行c1.showName.call(c2)等同于执行
function Class2() { this.name = “class2″;
this.showName = function() { alert(this.name); }
}
那么回到
//当我们使用object.each(function(){..})时,实际是进行的调用是 for(var i = i;i<object.length;i++){ var value = object[i]; //function中的this指向value,传入的参数为object的索引和索引处的值 function.call(value,i,value); }
因为function是我们要为object的每一个子集执行的方法,通过function.call(value,i,value)之后,我们把fuction的方法赋予了value,也就是object[i],通过for循环来执行从object索引为0到object.length-1的子集。
我们在实际应用的时候
$obj.each(func);
实际上就是把func通过call的方法给$obj的每一个子集遍历执行。
自己的语言表达能力还不是很好,如果觉得表达有误的可以指出来
jQuery each的实现与call方法的详细介绍的更多相关文章
- java中的compareto方法的详细介绍
java中的compareto方法的详细介绍 Java Comparator接口实例讲解(抽象方法.常用静态/默认方法) 一.java中的compareto方法 1.返回参与比较的前后两个字符串的as ...
- 电子表格控件Spreadsheet 对象方法事件详细介绍
1.ActiveCell:返回代表活动单元格的Range只读对象.2.ActiveSheet:返回代表活动工作表的WorkSheet只读对象.3.ActiveWindow:返回表示当前窗口的Windo ...
- js中的数组对象排序(方法sort()详细介绍)
定义和用法 sort() 方法用于对数组的元素进行排序. 语法 arrayObject.sort(sortby) 参数sortby:可选.规定排序顺序.必须是函数. 返回值 对数组的引用.请注意 ...
- Ext.Net GridPanel (属性|方法|配置|详细介绍)
1.Ext.NET ---- GridPanel 主要配置项: store:表格的数据集 columns:表格列模式的配置数组,可自动创建ColumnModel列模式 autoExpandColumn ...
- java中的compareto方法以及LIst列表排序的详细介绍【转】
java中的compareto方法的详细介绍 javacompareTo java中的compareto方法,返回参与比较的前后两个字符串的asc码的差值,看下面一组代码 String a=&quo ...
- jquery数组删除指定元素的方法:grep()
jquery数组删除指定元素的方法:grep() 金刚 数组 jquery javascript 元素 遇到的问题 今天遇到一个问题,删除数组中的一个指定元素,并返回新的数组. 我定义的js数组是这样 ...
- JQuery中操作Css样式的方法
JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...
- jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法
jquery ajax success 函数 异步调用方法中不能给全局变量赋值的原因及解决办法 在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们 ...
- jquery里面的名称冲突解决方法
jQuery 使用 $ 符号作为 jQuery 的简介方式. 某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号. jQuery 使用名为 noConflict( ...
随机推荐
- Eclipse 安装FindBugs插件
FindBugs 是由马里兰大学提供的一款开源 Java静态代码分析工具.FindBugs通过检查类文件或 JAR文件,将字节码与一组缺陷模式进行对比从而发现代码缺陷,完成静态代码分析.FindBug ...
- SPRING IN ACTION 第4版笔记-第八章Advanced Spring MVC-006-Pizza例子的支付流程
一. 1. 2.payment-flow.xml <?xml version="1.0" encoding="UTF-8"?> <flow x ...
- 编程实现Windows关机、重启、注销
要想编程使Windows关机.重启或者注销,可以使用ExWindowsEx这个API函数,该函数只有两个参数,第一个表示关机动作的标志,也就是你要让该函数关机呢,还是重启,还是注销等.可以使用EWX_ ...
- Android:Toast简单消息提示框
Toast是简单的消息提示框,一定时间后自动消失,没有焦点. 1.简单文本提示的方法: Toast.makeText(this, "默认的toast", Toast.LENGTH_ ...
- 99. Recover Binary Search Tree
题目: Two elements of a binary search tree (BST) are swapped by mistake. Recover the tree without chan ...
- Hadoop分布式文件系统(HDFS)详解
HDFS简介: 当数据集的大小超过一台独立物理计算机的存储能力时,就有必要对它进行分区 (partition)并存储到若干台单独的计算机上.管理网络中跨多台计算机存储的文件系统成为分布式文件系统 (D ...
- JavaScript DOM高级程序设计 7.向应用程序加入Ajax--我要坚持到底!
有时候,或许是因为理解能力,也或许是因为浮躁,看东西总是不入心,而且还老是想跳过本节,或者赶紧看完本节,这样的恶性循环,让我在即没有真正的学习到知识,又打击我的学习信心,还浪费了我很多事件,我想,当遇 ...
- android 页面滑动 ViewFlipper,OnGestureListener,OnTouchListener
public class Main extends Activity implements OnGestureListener, OnTouchListener { // 一般不直接使用ViewAni ...
- Android开发之ADT导入Support Library
在工程中增加(例如 support-v4 Library) 在ADT中需要按照以下步骤: 1.右击当前工程,查找Properties 2.选择Java Build Path 3.选择Librarie ...
- SharePoint2010 自定义代码登录方法
转:http://yysyb123.blog.163.com/blog/static/192050472011382421717/ SharePoint2010 自定义代码登录方法 (自定义Form验 ...