分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 软件开发

深入理解jQuery中的each方法

发布时间:2023-09-06 01:41责任编辑:胡小海关键词:jQuery

写在前面

我们先回顾一下数组中的forEach方法吧。在数组的实例上有个forEach方法供所有实例使用,forEach里面接收一个回调函数,而且回调函数默认接收三个参数:当前项,索引,数组 。forEach循环有个特点,就是无论如何都会把数据遍历完成。

each方法

each方法不仅是jQuery的静态方法而且还是jQuery元素原型中的方法

静态方法通过:$.each(数组或对象,函数) 这样的形式执行,注意:数组和对象都可以作为参数哦

原型方法通过:$(匹配元素集合) .each(函数) 这样的形式执行

其实不管是静态方法还是原型中的方法,都是执行同一个each方法,我们来看看源代码吧

 1 each: function( obj, callback ) { 2 ????????var length, i = 0; 3 ?4 ????????if ( isArrayLike( obj ) ) { 5 ????????????length = obj.length; 6 ????????????for ( ; i < length; i++ ) { 7 ????????????????if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) { 8 ????????????????????break; 9 ????????????????}10 ????????????}11 ????????} else {12 ????????????for ( i in obj ) {13 ????????????????if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {14 ????????????????????break;15 ????????????????}16 ????????????}17 ????????}18 19 ????????return obj;20 ????}

上面是jQuery的静态方法,下面是原型上的方法

each: function( callback ) { ???????return jQuery.each( this, callback ); ???},

原型上的each方法只是把this当做参数传入了,也就是参数obj,each方法中的还通过is ArrayLike来判断是不是类数组,然后在循环,如果是对象也做了处理,要注意的是回调函数,如果回调函数返回false值那么each方法将会停止遍历,这是一个很大的区别。

如果的jQuery的原型不理解可以先阅读

wuxianqiang/blog

深入理解jQuery中的each方法

原文地址:https://www.cnblogs.com/wuxianqiang/p/8412888.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved