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库?(五)的更多相关文章

  1. 可想实现一个自己的简单jQuery库?(九)

    Lesson-8 事件机制 在讲事件机制之前呢,我们有一个很重要的东西要先讲,那就是如何实现事件委托(代理). 只有必须先明白了如何实现一个事件委托,我们才能更好的去实现on和off.在我看来,on和 ...

  2. 前端开发:一个开源、简单易用的jQuery表格插件(DataTables)

    DataTables是一个基于jQuery库的开源(MIT协议)表格插件,支持添加.排序.分页.搜索.过滤等功能,使用简单.广受欢迎,能够与主流前端UI整合(如bootstrap.jQuery UI等 ...

  3. JQCloud: 一个前端生成美化标签云的简单JQuery插件

    本文原文地址:https://jiang-hao.com/articles/2018/blog-JQCloud.html 因为博客需要,发现了一个生成美化简约风格的标签云的JQuery插件. 官网地址 ...

  4. 纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!

    前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简单的HTML+CSS+JQUERY完成100个版本更新记录的华丽转身!>受到很多网友的喜爱,今天特别推出姊妹篇<纯手工打造漂亮的瀑 ...

  5. 你想建设一个能承受500万PV/每天的网站吗?服务器每秒要处理多少个请求才能应对?

    你想建设一个能承受500万PV/每天的网站吗?服务器每秒要处理多少个请求才能应对? 你想建设一个能承受500万PV/每天的网站吗? 500万PV是什么概念?服务器每秒要处理多少个请求才能应对?如果计算 ...

  6. 你想建设一个能承受500万PV/每天的网站吗?

    (如果感觉有帮助,请帮忙点推荐,添加关注,谢谢!你的支持是我不断更新文章的动力.本博客会逐步推出一系列的关于大型网站架构.分布式应用.设计模式.架构模式等方面的系列文章) 你想建设一个能承受500万P ...

  7. 你想建设一个能承受500万PV/每天的网站吗?如果计算呢?(转)

    作者:赵磊 博客:http://elf8848.iteye.com 你想建设一个能承受500万PV/每天的网站吗? 500万PV是什么概念?服务器每秒要处理多少个请求才能应对?如果计算呢? PV是什么 ...

  8. [置顶] 纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!

    前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简单的HTML+CSS+JQUERY完成100个版本更新记录的华丽转身!>受到很多网友的喜爱,今天特别推出姊妹篇<纯手工打造漂亮的瀑 ...

  9. 瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!

    纯手工打造漂亮的瀑布流,五大插件一个都不少Bootstrap+jQuery+Masonry+imagesLoaded+Lightbox!   前两天写的文章<纯手工打造漂亮的垂直时间轴,使用最简 ...

随机推荐

  1. mysql索引技术名词1-5

    目录 索引技术名词 1.回表 2.覆盖索引 3.最左匹配原则 4.索引下推 5.谓词下推 索引技术名词 1.回表 注意: 1.如果依靠主键查询,叶子结点直接存储数据----主键B+树 2.如果依靠其他 ...

  2. Python:Scrapy(四) 命令行相关

    学习自Scrapy 2.4.1 documentation 这一部分是对官方文档的学习,主要是理解翻译,来对之前的应用部分进行详细的理论补充. 1.保存爬取到的要素的方式: ①运行scrapy指令时, ...

  3. Tableau学习Step2一数据文件的读取与统计图、表的概述

    Tableau学习Step2一数据文件的读取与统计图.表的概述 本文首发于博客冰山一树Sankey,去博客浏览效果更好. 一. 前言 本教程通过一个案例从浅到深来学习Tableau知识 案例概述: 二 ...

  4. 矩池云上nvidia opencl安装及测试教程

    本教程租用的是2080ti,3.7多框架镜像. 添加nvidia-cuda的阿里源 curl -fsSL https://mirrors.aliyun.com/nvidia-cuda/ubuntu18 ...

  5. 矩池云上安装yolov5并测试教程

    官方仓库:https://github.com/ultralytics/yolov5 官方文档:https://docs.ultralytics.com/quick-start/ 此案例我是租用了k8 ...

  6. svelte组件:Svelte3自定义Navbar+Tabbr组件|svelte自定义插件

    基于Svelte3自定义组件Navbar+Tabbar沉浸式导航条|底部凸起菜单栏 Svelte 一种全新的构建用户界面的框架.当下热门的 Vue 和 React 在浏览器中需要做大量的工作,而 Sv ...

  7. 微信小程序书简易支付

    这里结合了上一篇的手机号登录接下来的实现功能 https://www.cnblogs.com/xiaoyantongxue/p/15472915.html 登录后进入课程选择页面 1:数据库填入数据 ...

  8. 工程师计划3 -> 项目管理2 | 项目组织与团队管理

    前几天才收到这门课的教材,发现网课的周和课本的章节不完全对应,我以教材的章节为单位进行总结和思考.这篇就是对于第二章的梳理. 0317附:这篇压了很久了,已经落后课程进度了.整理下来觉得有些偏理论,后 ...

  9. 高并发之 API 接口,分布式,防刷限流,如何做?

    在开发分布式高并发系统时有三把利器用来保护系统:缓存.降级.限流 缓存 缓存的目的是提升系统访问速度和增大系统处理容量 降级 降级是当服务出现问题或者影响到核心流程时,需要暂时屏蔽掉,待高峰或者问题解 ...

  10. Spring MVC 实验3 springMVC框架基础

    实验三:spring mvc框架基础 实验目的: (1)理解spring mvc框架的运行流程 . (2)掌握springmvc框架的配置 实验要求: 请根据课程内容,  修改项目中的任意一用例,将控 ...