prop() prop: function( elem, name, value ) { var ret, hooks, notxml, nType = elem.nodeType; // don't get/set properties on text, comment and attribute nodes //标签不存在或者是文本.属性.注释节点 if ( !elem || nType === 3 || nType === 8 || nType === 2 ) { return; } no…

本课主要来讲解jQuery.event.trigger的源码解读. trigger = function(event, data, elem, onlyHandlers){ if(elem && (elem.nodeType === 3 || elem.nodeType ===8)){  //触发的元素节点不能是文本节点和注释节点 return; } var cache, exclusive, i, cur, old, ontype, special, handle, eventPath,…

这里的实现也很容易懂,通过jQuery的静态方法each给jQuery的原型添加scrollLeft和scrollTop方法. 这里在取值时它把window和普通的element做了区分 如果是window,就使用window.pageXOffset window.pageYOffset获取 如果是element,就通过element.scrollLeft element.scrollTop获取. 关于pageXOffset,MDN中介绍: var x = (window.pageXOffset…

pagination的github地址:https://github.com/gbirke/jquery_pagination 公司用的是1.2的版本,所以我就读1.2的了. jQuery.fn.pagination = function(maxentries, opts){ opts = $.extend({ isCurrentInfo: false,//是否显示当前页信息: 当前第1页,共10页 currentCls: '.current-info',//当前页class items_per…

本课还是来讲解一下jQuery是如何实现它的事件系统的.这一课我们先来讲一下jQuery.event.remove的源码解读. remove方法的目的是,根据用户传参,找到事件队列,从里面把匹配的handleObj对象移除,在参数不足的情况下,可能移除多个或所有的handleObj.当队列的长度为0(当某事件的事件处理函数数组为空时,就代表此类型事件没有事件处理函数了,因此移除此事件)时,就移除相应的事件,当events为空对象(events是元素绑定的所有事件类型的集合,当它为空时,就代表元素…

本课主要来讲解一下jQuery是如何实现它的事件系统的. 我们先来看一个问题: 如果有一个表格有100个tr元素,每个都要绑定mouseover/mouseout事件,改成事件代理的方式,可以节省99次绑定,更何况它还能监听将来添加的tr元素.这就是jQuery中的live方法. 这种机制使用的是事件冒泡机制实现的,我们把事件处理函数绑定在tr的父元素上,然后再tr上面触发的事件会冒泡到tr的父元素,因此父元素就可以触发这个事件处理函数,在事件处理函数中就可以通过这个event获取到事件源,然后…

一.参数标记 /* * once: 确保回调列表仅只fire一次 * unique: 在执行add操作中,确保回调列表中不存在重复的回调 * stopOnFalse: 当执行回调返回值为false,则终止回调队列的执行 * momery: 记录上一次fire时的参数,并在add中传递给fire和执行fire,执行时firingIndex为上一次fire时的firingLength */ 二.源码解读分析 var optionsCache = {}, // Used for splitting o…

最近一直在研读 jQuery 源码,初看源码一头雾水毫无头绪,真正静下心来细看写的真是精妙,其结构明晰,高内聚.低耦合,兼具优秀的性能与便利的扩展性,在浏览器的兼容性(功能缺陷.渐进增强)优雅的处理能力以及 Ajax 等方面周到而强大的定制功能无不令人惊叹. jQuery 的整体结构是这样的: jQuery 整体架构 不同于 jQuery 代码各个模块细节实现的晦涩难懂,jQuery 整体框架的结构十分清晰,按代码行文大致分为如上图所示的模块. 初看 jQuery 源码可能很容易一头雾水,因为…

分离构造器 通过new操作符构建一个对象,一般经过四步: A.创建一个新对象 B.将构造函数的作用域赋给新对象(所以this就指向了这个新对象) C.执行构造函数中的代码 D.返回这个新对象 最后一点就说明了,我们只要返回一个新对象即可.其实new操作符主要是把原型链跟实例的this关联起来,这才是最关键的一点,所以我们如果需要原型链就必须要new操作符来进行处理.否则this则变成window对象了. 改造jQuery无new的格式,我们可以通过instanceof判断this是否为当前实例:…

parseJSON: function( data ) { // Attempt to parse using the native JSON parser first if ( window.JSON && window.JSON.parse ) { return window.JSON.parse( data ); } if ( data === null ) { return data; } if ( typeof data === "string" ) { //…

underscore 源码解读 API文档浏览器 JavaScript 中加号操作符细节 抛弃 jQuery,拥抱原生 JS 从 0 开始学习 GitHub 系列之「加入 GitHub」 js实现克隆一个对象 js之封装sort实现json格式数据的排序 js之replace实现简单模板替换引擎 请描述一下 cookies,sessionStorage 和 localStorage 的区别? 正则入门小随 jQuery中的deferred对象的使用(一) 基于Bootstrap的CSS3下拉菜单…

写在前面: 最近做的一个项目,用的require和backbone,对两者的使用已经很熟悉了,但是一直都有好奇他们怎么实现的,一直寻思着读读源码.现在项目结束,终于有机会好好研究一下. 本文重要解读requirejs的源码,backbone源码分析将会随后给出. 行文思路: requirejs 基本介绍 requirejs使用后的几个好奇 requirejs源码解读 requirejs基本介绍 由于篇幅有限,这里不会详解requirejs的使用和api,建议读者朋友自己去用几次,再详读api.…

etcd中raft实现源码解读 前言 raft实现 看下etcd中的raftexample newRaftNode startRaft serveChannels 领导者选举 启动并初始化node节点 发送心跳包 作为leader 作为follower 作为candidate leader选举 1.接收leader的心跳 2.发起竞选 3.其他节点收到信息,进行投票 4.candidate节点统计投票的结果 日志同步 WAL日志 leader同步follower日志 总结 参考 etcd中raf…

前言 上一篇文章 Vue 源码解读(2)-- Vue 初始化过程 详细讲解了 Vue 的初始化过程,明白了 new Vue(options) 都做了什么,其中关于 数据响应式 的实现用一句话简单的带过,而这篇文章则会详细讲解 Vue 数据响应式的实现原理. 目标 深入理解 Vue 数据响应式原理. methods.computed 和 watch 有什么区别? 源码解读 经过上一篇文章的学习,相信关于 响应式原理 源码阅读的入口位置大家都已经知道了,就是初始化过程中处理数据响应式这一步,即调用…

特殊说明 由于文章篇幅限制,所以将 Vue 源码解读(8)-- 编译器 之 解析 拆成了两篇文章,本篇是对 Vue 源码解读(8)-- 编译器 之 解析(上) 的一个补充,所以在阅读时请同时打开 Vue 源码解读(8)-- 编译器 之 解析(上) 一起阅读. processAttrs /src/compiler/parser/index.js /** * 处理元素上的所有属性: * v-bind 指令变成:el.attrs 或 el.dynamicAttrs = [{ name, value,…

前言 这篇文章是 Vue 编译器的最后一部分,前两部分分别是:Vue 源码解读(8)-- 编译器 之 解析.Vue 源码解读(9)-- 编译器 之 优化. 从 HTML 模版字符串开始,解析所有标签以及标签上的各个属性,得到 AST 语法树,然后基于 AST 语法树进行静态标记,首先标记每个节点是否为静态静态,然后进一步标记出静态根节点.这样在后续的更新中就可以跳过这些静态根节点的更新,从而提高性能. 这最后一部分讲的是如何从 AST 生成渲染函数. 目标 深入理解渲染函数的生成过程,理解编译器…

前言 上一篇文章 Vue 源码解读(10)-- 编译器 之 生成渲染函数 最后讲到组件更新时,需要先执行编译器生成的渲染函数得到组件的 vnode. 渲染函数之所以能生成 vnode 是通过其中的 _c._l.._v._s 等方法实现的.比如: 普通的节点被编译成了可执行 _c 函数 v-for 节点被编译成了可执行的 _l 函数 ... 但是到目前为止我们都不清楚这些方法的原理,它们是如何生成 vnode 的?只知道它们是 Vue 实例方法,今天我们就从源码中找答案. 目标 在 Vue 编译器…

第七篇 前言 本篇文章主要讲解下载操作的相关知识,SDWebImageDownloaderOperation的主要任务是把一张图片从服务器下载到内存中.下载数据并不难,如何对下载这一系列的任务进行设计,就很难了.接下来我们一步一步的分析作者在开发中的思路和使用到的技术细节. NSOperation NSOperation想必大家都知道,为了让程序执行的更快,我们用多线程异步的方式解决这个问题,GCD与NSOperation都能实现多线程,我们这里只介绍NSOperation.如果大家想了解更多N…

第一篇 前言 从今天开始,我将开启一段源码解读的旅途了.在这里先暂时不透露具体解读的源码到底是哪些?因为也可能随着解读的进行会更改计划.但能够肯定的是,这一系列之中肯定会有Swift版本的代码. 说说我的目的.想成为一名好的程序员,肯定绕不开模仿这条路.之所以做出这么一个决定,也是想提高自己写框架的能力,逻辑思维能力,扩展知识面.同时也能够给那些想了解这些框架的同学一些基本的解释.何乐而不为呢? 解读方法 对于框架的源码解读,我个人的习惯是先看头文件,先从头文件最简单的开始解读,也就是说首先看不…

第二篇 前言 本篇是和GIF相关的一个UIImage的分类.主要提供了三个方法: + (UIImage *)sd_animatedGIFNamed:(NSString *)name ----- 根据名称获取图片 + (UIImage *)sd_animatedGIFWithData:(NSData *)data ----- 根据NSData获取图片 - (UIImage *)sd_animatedImageByScalingAndCroppingToSize:(CGSize)size -----…

第三篇 前言 本篇主要解读SDWebImage的配置文件.正如compat的定义,该配置文件主要是兼容Apple的其他设备.也许我们真实的开发平台只有一个,但考虑各个平台的兼容性,对于框架有着很重要的意义.这篇文章的重点是抽取出对于iOS很重要的用法,能够在项目开发中提高效率. #import 导入这个头文件,我们就能访问系统提供的配置选项了,我们接下来会对该文件出现的配置属性做出解释. __OBJC_GC__ #ifdef __OBJC_GC__ #error SDWebImage does…

第四篇 前言 首先,我们要弄明白一个问题? 为什么要对UIImage进行解码呢?难道不能直接使用吗? 其实不解码也是可以使用的,假如说我们通过imageNamed:来加载image,系统默认会在主线程立即进行图片的解码工作.这一过程就是把image解码成可供控件直接使用的位图. 当在主线程调用了大量的imageNamed:方法后,就会产生卡顿了.为了解决这个问题我们有两种比较简单的处理方法: 我们不使用imageNamed:加载图片,使用其他的方法,比如imageWithContentsOfFi…

第五篇 前言 本篇主要讲解图片缓存类的知识,虽然只涉及了图片方面的缓存的设计,但思想同样适用于别的方面的设计.在架构上来说,缓存算是存储设计的一部分.我们把各种不同的存储内容按照功能进行切割后,图片缓存便是其中的一个. 我们在封装自己的图片缓存管理对象的时候,SDWebImageCache能够提供大约90%的代码给我们直接使用,基于这些代码,我们需要分析出作者的设计思想是什么?当需要缓存某个列表时,基于SDWebImageCache的设计思想,我们就能够设计出比较合理的缓存管理对象了. 所谓举一…

第六篇 前言 我们在SDWebImageCache(上)中了解了这个缓存类大概的功能是什么?那么接下来就要看看这些功能是如何实现的? 再次强调,不管是图片的缓存还是其他各种不同形式的缓存,在原理上都极其相似,我们通过SDWebImageCache,来看看作者是如何实现这个功能的. 在业务中,经常要缓存数据,通过本篇的学习,我们写出的缓存管理者这个管理者对象,就能够有所进步. NSCache 对于很多开发者来说,NSCache是一个陌生人,因为大家往往对NSMutableDictionary情有独…

承接上一篇AFNetworking 3.0 源码解读 总结(干货)(上) 21.网络服务类型NSURLRequestNetworkServiceType 示例代码: typedef NS_ENUM(NSUInteger, NSURLRequestNetworkServiceType) { NSURLNetworkServiceTypeDefault = 0, // Standard internet traffic NSURLNetworkServiceTypeVoIP = 1, // Voic…

养成记笔记的习惯,对于一个软件工程师来说,我觉得很重要.记得在知乎上看到过一个问题,说是人类最大的缺点是什么?我个人觉得记忆算是一个缺点.它就像时间一样,会自己消散. 前言 终于写完了 AFNetworking 的源码解读.这一过程耗时数天.当我回过头又重头到尾的读了一篇,又有所收获.不禁让我想起了当初上学时的种种情景.我们应该对知识进行反复的记忆和理解.下边是我总结的 AFNetworking 中能够学到的知识点. 1.枚举(enum) 使用原则:当满足一个有限的并具有统一主题的集合的时候,我…

AFNetworking的源码解读马上就结束了,这一篇应该算是倒数第二篇,下一篇会是对AFNetworking中的技术点进行总结. 前言 上一篇我们总结了 UIActivityIndicatorView UIRefreshControl UIImageView 这3个控件的分类.那么这一篇就总结下剩余的3个分类:UIButton UIProgressView UIWebView . UIButton+AFNetworking UIButton跟图片相关的属性大概有两个,Image和Backgro…

我们应该看到过很多类似这样的例子:某个控件拥有加载网络图片的能力.但这究竟是怎么做到的呢?看完这篇文章就明白了. 前言 这篇我们会介绍 AFNetworking 中的3个UIKit中的分类.UIActivityIndicatorView UIRefreshControl UIImageView.读完本篇就能够明白控件是如何显示网络图片的.那么如果你有兴趣,可以尝试让一个控件的layer也能够加载网络图片. 提供的功能 我们解读源码不仅仅是了解内部实现原理,还要让开发者明白在这些分类中我能够使用那…

让我们的APP像艺术品一样优雅,开发工程师更像是一名匠人,不仅需要精湛的技艺,而且要有一颗匠心. 前言 AFNetworkActivityIndicatorManager 是对状态栏中网络激活那个小控件的管理.在平时的开发中,我们很可能忽略了它的存在.然而,实现对它的管理,让我们的APP更符合人机交互,不也是件大快人心的事儿吗.看下边这张图片就明白了: AFNetworkActivityIndicatorManager 接口 // 这个宏的意思指下边的类不能被扩展 NS_EXTENSION_UN…

AFImageDownloader 这个类对写DownloadManager有很大的借鉴意义.在平时的开发中,当我们使用UIImageView加载一个网络上的图片时,其原理就是把图片下载下来,然后再赋值.这也是AFImageDownloader这个类的核心功能. 前言 AFImageDownloader 专门管理一组图片的下载任务.试想,如果有一个界面的功能是对图片进行处理,要求下载高清图片,那么这个AFImageDownloader就用上了. 1.AFImageDownloadPrioriti…