实现jQuery.each方法

原创 2017年08月12日 21:25:54

参考JavaScript专题之jQuery通用遍历方法each的实现

$.each是一个通用的迭代函数,可以用来迭代数组与对象。

$.each(arr,function(index,value){
    ……
})

$.each(obj,function(prop,value){
    ……
})

$.each()函数和 $(selector).each()是不一样的,那个是专门用来遍历一个jQuery对象。$.each()函数可用于迭代任何集合,无论是“名/值”对象或数组。

那么我们该怎么实现这样一个 each 方法呢?

首先,我们肯定要根据参数的类型进行判断,如果是数组,就调用 for 循环,如果是对象,就使用 for in 循环。

function each(obj,callback){
    if(Array.isArray(obj)){
        for(var i=0;i<obj.length;i++){
            callback.call(obj[i],i,obj[i]);
        }
    }else{
        for(var prop in obj){
            callbackcall(obj[prop],prop,obj[prop]);
        }
    }
}

使用call调用回调函数是为了保证this的正确指向。

这个函数看起来与原生的forEach方法没有什么区别,但是$.each是支持在回调函数中返回return false来终止循环的。
这里我们也可以通过监测callback返回的值来实现:

function each(obj,callback){
    if(Array.isArray(obj)){
        for(var i=0;i<obj.length;i++){
            if(callback(i,obj[i]) === false){
                break;
            }
        }
    }else{
        for(var prop in obj){
            if(callback(prop,obj[prop]) === false){
                break;
            }
        }
    }
}
版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

JavaScript专题之jQuery通用遍历方法each的实现

JavaScript专题之jQuery通用遍历方法each的实现 JavaScript 专题系列第十一篇,讲解 jQuery 通用遍历方法 each 的实现 each介绍 jQu...

jquery 里的each使用方法

each()方法能使DOM循环结构简洁,不容易出错。each()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组、多维数组、DOM, JSON 等等 在javaScript开发过程...

Jquery中each的三种遍历方法

1、选择器+遍历 $('div').each(function (i){    i就是索引值    this 表示获取遍历每一个dom对象 }); 2、选择器+遍历 $('div&...

Jquery - map、has、each 方法简述

问题导读: 1. Jquery map 方法 2. Jquery has 方法 3. Jquery each 方法 解决方案: map 遍历 map 把每个元素通过函数传递到当前匹配集...

Jquery中find与each方法使用详解

本文实例讲述了jQuery中find与each方法用法。分享给大家供大家参考。具体如下: 一、find()方法 jquery选择器非常强大,利用css的命名规约,可以更快更方便的找出想要的元素。 ...

Jquery中的each方法

each()方法能使DOM循环结构简洁,不容易出错。each()函数封装了十分强大的遍历功能,使用也很方便,它可以遍历一维数组、多维数组、DOM, JSON 等等 在javaScript开发过程中使...

DOM 和 jQuery对象相互转换 以及for-in和$.each遍历方法

DOM 和 jQuery对象相互转换 以及for-in和$.each遍历方法

JQuery中each()的使用方法说明

转载:http://www.jb51.net/article/24581.htm 对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQ...

jQuery 链式编程/隐式迭代/each方法/多库共存

1.链式编程 // 链式编程代码示例 $(“li”).parent(“ul”).parent().siblings(“div”).children(“div”).html(“内容”); ...

jQuery each() 方法

概述:jQuery中的 each 函数很方便,$.each ()函数封装了十分强大的遍历功能,它可以遍历一维数组、多维数组、DOM ,JSON 等等。$.each()与$(selector).each...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)