each()实现

var jQuery = function( selector, context ) {
return new jQuery.fn.init( selector, context );
};
jQuery.fn = jQuery.prototype = {
selector: "",
init: function(selector){
//仍然是mini的选择器。
var result = document.querySelectorAll(selector);
for(var i = 0;i < result.length;i++){
this[i] = result[i]
}
this.length = result.length;
},
//指定操作对象为this
each: function(callback){
return jQuery.each(this,callback)
},
constructor : jQuery
}
jQuery.fn.init.prototype = jQuery.fn
//对任意对象进行迭代操作
jQuery.each = function(obj,callback){
for(var i = 0;i<obj.length;i++){
//运用call调整this的指向
//回调函数里的this指向操作的对象
//方便操作
callback.call(obj[i],i,obj[i]);
}
//链式调用
return obj
}
//测试
jQuery("div").each(function(index, element) {
console.log(this)
});
//jQ内部也经常用迭代操作数组或其它。
jQuery.each("Boolean Number String Function Array Date RegExp Object Error".split(" "), function(i, name) {
console.log(name.toLowerCase())
});

jQuery.each是jQuery的工具,迭代操作对象合集里的对象,所以不用继承在原型中,而jQuery.fn.each就是jQuery.each的一个特例。

each是一个典型的迭代运用,如我们想对一个合集的对象都执行的某功能,callback,通过each遍历对象或者数组就可以实现不停变化callback的操作对象。

原理很简单就是将元素遍历依次传给回调函数,原代码中还考虑了一些情况,但没什么新知识,我就不补充了。

回调函数

作为参数的函数就叫回调函数。当一个函数接收一个函数

jQuery源码笔记——四的更多相关文章

  1. jQuery源码笔记(一):jQuery的整体结构

    jQuery 是一个非常优秀的 JS 库,与 Prototype,YUI,Mootools 等众多的 Js 类库相比,它剑走偏锋,从 web 开发的实用角度出发,抛除了其它 Lib 中一些中看但不实用 ...

  2. Tomcat8源码笔记(四)Server和Service初始化

    上一章 简单说明下Tomcat各个组件: Server:服务器,Tomcat服务器,一个Tomcat只有一个Server组件; Service:业务层,是Server下最大的子容器,一个Server可 ...

  3. jQuery源码笔记(二):定义了一些变量和函数 jQuery = function(){}

    笔记(二)也分为三部分: 一. 介绍: 注释说明:v2.0.3版本.Sizzle选择器.MIT软件许可注释中的#的信息索引.查询地址(英文版)匿名函数自执行:window参数及undefined参数意 ...

  4. jquery源码分析(四)——回调对象 Callbacks

    借用百度百科来说明下回调函数: 回调函数就是一个通过函数指针调用的函数.如果你把函数的指针(地址)作为参数传递给另一个函数,当这个指针被用来调用其所指向的函数时,我们就说这是回调函数.回调函数不是由该 ...

  5. jQuery 源码分析(四) each函数 $.each和$.fn.each方法 详解

    $.each一般用来遍历一个数组或对象,$.fn.each()就是指jQuery实例可以执行的操作(因为$.fn是jQuery对象的原型) $.each用来遍历一个数组或对象,并依次执行回掉函数,最后 ...

  6. jQuery源码笔记——回调对象

    回调对象是一个多用途的回调列表对象,提供了强大的的方式来管理回调函数列表. 最简单的缓存对象 function Callbacks(){ var list = [], self = { add: fu ...

  7. jQuery源码笔记——延迟对象

    提供一种方法来执行一个或多个对象的回调函数, Deferred对象通常表示异步事件. 它是回调对象的拓展运用,在jQuery当中非常依赖回调对象. 一个简单的,只解决成功状态下的缓存实例 functi ...

  8. jQuery源码笔记——数据缓存

    数据缓存是为了解决内存泄露,他的原理是,当我们将数据存储到一个对象上面,实际上是将所有的数据存到一个单独的数据对象里,而这个对象只提供一个接口,这个接口可以访问自己存在数据对象里自己的数据. 这是一个 ...

  9. jQuery源码笔记——三

    将类数组对象转化为数组对象 javascript中有许多类数组对象,比如HTMLCollection,NodeList,arguments.她们的特点是和数组一样有length属性,并且有0,1,2这 ...

随机推荐

  1. HDU1181 变形课 (回溯法)

    变形课 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65536 K (Java/Others)Total Submis ...

  2. poj 1573 Robot Motion_模拟

    又是被自己的方向搞混了 题意:走出去和遇到之前走过的就输出. #include <cstdlib> #include <iostream> #include<cstdio ...

  3. linux shell命令行下操作mysql 删除mysql指定数据库下的所有表--亲测成功百分百测试通过--绝对可靠

    1,在shell提示符下查看mysql指定数据库下的表等数据

  4. autolisp 列表 resbuf

    有以下 list : (1 2 3 (4 5 6) "Properties" (("id" . 3) ("name" . "hel ...

  5. Font Awesome 4.0.3 提供了369个网页常用的矢量字体图标

    Font Awesome 为您提供了一套可缩放的字体矢量图标,可以快速自定义图标的大小,颜色,阴影,这些都可以通过CSS来实现,无需任何的JS代码哦. 一,主要特点如下: 1,一个字体,369个图标 ...

  6. 关于js对象值的传递

    结合红宝书和网上的一些文章,记录下自己对关于js对象的值的传递的一些理解. js对象是保存在堆内存中的,当把对象赋值给变量时,是把对象在堆内存的引用(地址)赋值给了变量,变量通过地址来访问对象.下面来 ...

  7. JavaScript中forEach的用法相关

    首先说下JavaScript的forEach的标准格式. 为数组中的每个元素执行指定操作. array1.forEach(callbackfn[, thisArg]) 参数 定义 array1 必需. ...

  8. Notification在不同版本SDK中的使用

    今天总结了一下Notification的使用,发现这个控件在版本上有点扯淡.API11和API16两个分水岭,导致菜鸟在学习的时候比较吃力,受影响的外界因素是多样的,其中比较重要的就是你测试的andr ...

  9. android Mvp简单实用

    View 对应于Activity,负责View的绘制以及与用户交互Model 依然是业务逻辑和实体模型Presenter 负责完成View于Model间的交互 模拟客户端的登录操作,并实现登录成功与登 ...

  10. sql update小结

    以前update用的不少,但都是简单的单表操作,没有在意,最近查阅多表关联更新及更新top n,发现update还真灵活,记录如下(在mssqlserver2008r2下测试通过): 1单表操作  u ...