可想实现一个自己的简单jQuery库?(五)
Lesson-4
这个版本我们要增加一个用的非常多的方法!
那就是each!
我们知道each不仅能遍历数组,还能遍历对象.
首先我们需要一个对数组进行验证的方法
function isArray(obj) {
return Array.isArray(obj);
}
接着就是我们的重头戏
Kodo.each = function(obj,callback) {
var len = obj.length,
constru = obj.constructor,
i = 0;
if(constru === window.f) {
for (; i < len; i++) {
var val = callback.call(obj[i],i,obj[i]);
if(val === false) break;
}
} else if (isArray(obj)) {
for (; i < len; i++) {
var val = callback.call(obj[i],i,obj[i]);
if(val === false) break;
}
} else {
for( i in obj ) {
var val = callback.call(obj[i],i,obj[i]);
if(val === false) break;
}
}
};
因为我们还可能遍历Kodo数组对象
如
f("div").each(function(index,item) {
})
所以还需要一个判断 是否是Kodo数组对象
if(constru === window.f) {
for (; i < len; i++) {
var val = callback.call(obj[i],i,obj[i]);
if(val === false) break;
}
}
在这应该强调下call的用法,还是很多人不知道call何时使用.
在我们的callback里 第一个参数是下标,第二个参数是当前的对象,然后this还要指向他自己
所以 callback.call(obj[i],i,obj[i]); 就是这样写 第一个参数是改变this指向,第二个参数是下标,第三个是自己本身
很简单不是吗?
既然你都看到这里了,还不给我一个star?!
github地址: https://github.com/MeCKodo/forchange/tree/master/lesson-4
可想造一个属于你自己的jQuery库?(四):http://segmentfault.com/a/1190000004001281
可想实现一个自己的简单jQuery库?(五)的更多相关文章
- 可想实现一个自己的简单jQuery库?(九)
Lesson-8 事件机制 在讲事件机制之前呢,我们有一个很重要的东西要先讲,那就是如何实现事件委托(代理). 只有必须先明白了如何实现一个事件委托,我们才能更好的去实现on和off.在我看来,on和 ...
- 前端开发:一个开源、简单易用的jQuery表格插件(DataTables)
DataTables是一个基于jQuery库的开源(MIT协议)表格插件,支持添加.排序.分页.搜索.过滤等功能,使用简单.广受欢迎,能够与主流前端UI整合(如bootstrap.jQuery UI等 ...
- JQCloud: 一个前端生成美化标签云的简单JQuery插件
本文原文地址:https://jiang-hao.com/articles/2018/blog-JQCloud.html 因为博客需要,发现了一个生成美化简约风格的标签云的JQuery插件. 官网地址 ...
- 纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!
前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简单的HTML+CSS+JQUERY完成100个版本更新记录的华丽转身!>受到很多网友的喜爱,今天特别推出姊妹篇<纯手工打造漂亮的瀑 ...
- 你想建设一个能承受500万PV/每天的网站吗?服务器每秒要处理多少个请求才能应对?
你想建设一个能承受500万PV/每天的网站吗?服务器每秒要处理多少个请求才能应对? 你想建设一个能承受500万PV/每天的网站吗? 500万PV是什么概念?服务器每秒要处理多少个请求才能应对?如果计算 ...
- 你想建设一个能承受500万PV/每天的网站吗?
(如果感觉有帮助,请帮忙点推荐,添加关注,谢谢!你的支持是我不断更新文章的动力.本博客会逐步推出一系列的关于大型网站架构.分布式应用.设计模式.架构模式等方面的系列文章) 你想建设一个能承受500万P ...
- 你想建设一个能承受500万PV/每天的网站吗?如果计算呢?(转)
作者:赵磊 博客:http://elf8848.iteye.com 你想建设一个能承受500万PV/每天的网站吗? 500万PV是什么概念?服务器每秒要处理多少个请求才能应对?如果计算呢? PV是什么 ...
- [置顶] 纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!
前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简单的HTML+CSS+JQUERY完成100个版本更新记录的华丽转身!>受到很多网友的喜爱,今天特别推出姊妹篇<纯手工打造漂亮的瀑 ...
- 瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!
纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox! 前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简 ...
随机推荐
- mysql索引技术名词1-5
目录 索引技术名词 1.回表 2.覆盖索引 3.最左匹配原则 4.索引下推 5.谓词下推 索引技术名词 1.回表 注意: 1.如果依靠主键查询,叶子结点直接存储数据----主键B+树 2.如果依靠其他 ...
- Python:Scrapy(四) 命令行相关
学习自Scrapy 2.4.1 documentation 这一部分是对官方文档的学习,主要是理解翻译,来对之前的应用部分进行详细的理论补充. 1.保存爬取到的要素的方式: ①运行scrapy指令时, ...
- Tableau学习Step2一数据文件的读取与统计图、表的概述
Tableau学习Step2一数据文件的读取与统计图.表的概述 本文首发于博客冰山一树Sankey,去博客浏览效果更好. 一. 前言 本教程通过一个案例从浅到深来学习Tableau知识 案例概述: 二 ...
- 矩池云上nvidia opencl安装及测试教程
本教程租用的是2080ti,3.7多框架镜像. 添加nvidia-cuda的阿里源 curl -fsSL https://mirrors.aliyun.com/nvidia-cuda/ubuntu18 ...
- 矩池云上安装yolov5并测试教程
官方仓库:https://github.com/ultralytics/yolov5 官方文档:https://docs.ultralytics.com/quick-start/ 此案例我是租用了k8 ...
- svelte组件:Svelte3自定义Navbar+Tabbr组件|svelte自定义插件
基于Svelte3自定义组件Navbar+Tabbar沉浸式导航条|底部凸起菜单栏 Svelte 一种全新的构建用户界面的框架.当下热门的 Vue 和 React 在浏览器中需要做大量的工作,而 Sv ...
- 微信小程序书简易支付
这里结合了上一篇的手机号登录接下来的实现功能 https://www.cnblogs.com/xiaoyantongxue/p/15472915.html 登录后进入课程选择页面 1:数据库填入数据 ...
- 工程师计划3 -> 项目管理2 | 项目组织与团队管理
前几天才收到这门课的教材,发现网课的周和课本的章节不完全对应,我以教材的章节为单位进行总结和思考.这篇就是对于第二章的梳理. 0317附:这篇压了很久了,已经落后课程进度了.整理下来觉得有些偏理论,后 ...
- 高并发之 API 接口,分布式,防刷限流,如何做?
在开发分布式高并发系统时有三把利器用来保护系统:缓存.降级.限流 缓存 缓存的目的是提升系统访问速度和增大系统处理容量 降级 降级是当服务出现问题或者影响到核心流程时,需要暂时屏蔽掉,待高峰或者问题解 ...
- Spring MVC 实验3 springMVC框架基础
实验三:spring mvc框架基础 实验目的: (1)理解spring mvc框架的运行流程 . (2)掌握springmvc框架的配置 实验要求: 请根据课程内容, 修改项目中的任意一用例,将控 ...