jquery的2.0.3版本源码系列(2):21行-94行定义了一些变量和函数 jQuery=function(){}
2.1.bug通过索引查询
这里的#13335是bug的索引,如何查询呢?
第一步,浏览器地址栏输入"https://bugs.jquery.com/"。
第二步,在网页的搜索框里输入索引值,那么就可以查询bug的更改历史(changelogs)了。


2.2 "use strict",不使用严格模式(20行)
代码不规范就会报错。IE的低版本并不支持,火狐可能假死。所以,这一行是一条注释,并不提倡使用。
"use strict"; a=10; //报错,Uncaught ReferenceError: a is not defined。必须添加上var。还有很多严格模式的报错,不细说。
2.3.变量rootjQuery
根据注释 // A central reference to the root jQuery(document) 说明他是一个指向document的根对象。搜索一下rootjQuery,866行, rootjQuery = jQuery(document); 接下来需要了解的是为什么要使用变量的形式,变量能将值语义化。 a=a+10; 这里并不知道10是什么东西,可是如果写成 var iSpeed=10; 那么可维护性和可读性会更高。
2.4.变量readyList
根据注释 // The deferred used on DOM ready 说明他是一个DOM加载时使用的延迟对象。
2.5.判断undefined的类型
代码 core_strundefined = typeof undefined 究竟有什么意图呢?这是在解决一个小众的bug。比如要判断a属性有没有被定义为window的属性,可以使用 window.a=="undefined"; 和 typeof window.a=="undefined"; 两种方式。可是第一种方式是有兼容问题的,第二种才是全能的。正如注释所说, // Support: IE9,For `typeof xmlNode.method` instead of `xmlNode.method !== undefined` 老版本的IE(6、7、8、9)在第一种方式上有兼容问题,为什么注释里写的是IE9,因为这里的源码版本是2.0.3,所以就不谈IE6、7、8。所以用typeof替代掉直接的逻辑判断。
2.6.变量location、document和docEle的保存
// Use the correct document accordingly with window argument (sandbox)通过window参数来使用正确的document location = window.location, document = window.document, docElem = document.documentElement,
现实中的沙箱,是一种儿童玩具,类如KFC中一个装满小球的容器,儿童可以在随意玩耍,起到保护儿童的作用。所以可以理解为安全环境。从代码的角度上说好处是把某些要用的属性用变量保存下来,那么压缩的时候就会变成字母。location是网址对象,document是document对象,docEle是html元素。

2.7.变量_jQuery、_$的保存、class2Type对象、core_deletedIds数组的定义
// Map over jQuery in case of overwrite 映射到jQuery以覆盖。 // Map over the $ in case of overwrite 映射到$以覆盖。说到这里,不得不说,jQuery框架提供给外部的方法是$()和jQuery(),而两个变量的作用是防止冲突。具体防冲突的方法在349行-817行的jQuery.extend()工具方法。class2type是$.type要用到的一个对象变量,用来存一些值。
// List of deleted data cache ids, so we can reuse them 说core_deletedIds是用来罗列删除的数据缓存id,所以我们可以重复使用它们。太棒了!
2.8.core_打头的局部变量存储
// Save a reference to some core methods 存储一些core方法的引用。变量的存储,方便使用(字符串更简洁),而且方便压缩。
core_version = "2.0.3",//存储了版本号 core_concat = core_deletedIds.concat,//数组的concat(合并)方法 core_push = core_deletedIds.push,//数组的push方法 core_slice = core_deletedIds.slice,//数组的slice方法 core_indexOf = core_deletedIds.indexOf, core_toString = class2type.toString,//对象的toString方法 core_hasOwn = class2type.hasOwnProperty, core_trim = core_version.trim,//trim是字符串的方法,去掉字符串首尾空格
需要说明的事trim方法。在老版本浏览器trim方法是没有的,所以要通过正则把首尾空格去掉。高级浏览器就有trim方法了,所以可以直接来用。这里的jQuery版本2.0.3是放弃了IE6、7、8的,所以这里可以直接使用trim方法。
有首尾空格的代码:alert("("+" 123456 "+")"); 它的显示效果是有空格的字符串。

使用了trim方法的代码: alert("("+" 123456 ".trim()+")"); ,它的显示效果是去掉首尾空格的。
2.9 jQuery函数
jQuery = function( selector, context ) {
// The jQuery object is actually just the init constructor 'enhanced'
//jQuery对象实际上,仅仅是初始化构造器的增强版本。
return new jQuery.fn.init( selector, context, rootjQuery );
},
jQuery函数通过8826行的 window.jQuery=window.$=jQuery; 暴露给外部jQuery的接口。对外提供的接口就是 $() 或者 jQuery() 。可以看到jQuery返回的是一个对象,所以后面可以接方法,包括链式调用,比如 $("#div1").css(); 。我们看见jQuery.fn.init,因为在 jQuery.fn = jQuery.prototype = {96行说的是prototype是fn,所以就是在原型上找init函数。
普通的面向对象写法是通过protoype写init和css方法,为了调用css方法需要先用new方法写构造器,然后使用init方法调用,最后才能调用到css方法。
function Aaa(){
}
Aaa.prototype.init=function(){
//初始化
}
Aaa.prototype.css=function(){
}
var al=new Aaa();
al.init();
al.css()
jQuery的面向对象写法是非常巧妙的,最终让$().css()能够成功找到css方法。
function jQuery(){
return new jQuery.prototype.init();
}
jQuery.prototype.init=function(){
};
jQuery.prototype.css=function(){
};
jQuery.fn.init.prototype = jQuery.fn;//fn也就是protoype。283行。
jQuery().css(); //调用jQuery()返回的是jQuery.prototype(jQuery原型)的init函数的原型构造器。它呢由于283行的赋值,所以刚刚的值就是jQuery.prototype。 //如上,调用jQuery()。得到的结果是jQuery.prototype。所以css就可以通过jQuery().css()。
2.10 正则有关的变量
关于core_pnum的正则, // Used for matching numbers 用来匹配数字的,比如正数啊、负数啊,有没有小数点,以及科学计数法。到css方法的时候要设置宽和高,要用到数字。
core_rnotwhite = /\S+/g, 这个正则呢, // Used for splitting on whitespace 是当字符串要用空格分割一下。 // A simple way to check for HTML strings // Prioritize #id over <tag> to avoid XSS via location.hash (#9521) // Strict HTML recognition (#11290: must start with <) rquickExpr是一个简单的方式来检查HTML字符串,前面部分是匹配标签,后面部分是匹配id。它可以用来防XSS注入。rsingleTag是匹配独立的标签。
msPrefix的ms是IE浏览器前缀,它跟其他浏览器前缀有区别。css中的margin-left在html DOM的属性是marginLeft。-webkit-margin-left在HTML DOM的属性是webkitMarginLeft。而-ms-margin-left在html DOM的属性是MsMarginLeft。rdashAlpha匹配的比如-2d,会修改为2d。
2.11 回调函数fcamelCase和completed
fcamelCase在jQuery.camelCase作为回调函数使用。completed是ready事件的处理器和自身的清除方法。
jquery的2.0.3版本源码系列(2):21行-94行定义了一些变量和函数 jQuery=function(){}的更多相关文章
- jquery的2.0.3版本源码系列(1)总体结构
为什么选择2.X版本,而不是1.X版本,因为2.X不兼容IE6/7/8,所以少了兼容代码,让我们更专注于jquery原理的代码. 一共有8830行. 1.1 匿名函数自执行 首先,匿名函数的作用是,把 ...
- jquery的2.0.3版本源码系列(6):2880-3042行,回调对象,对函数的统一管理
目录 1 . 回调对象callbacks的演示 回调的使用有一点像事件绑定,先绑定好,等到有点击事件或者其他时就触发. <script src="js/jquery-2.0.3.js& ...
- jquery的2.0.3版本源码系列(4):285-348行,extend方法详解
目录 1 . jquery extend的基本使用 通过285行的源码 jQuery.extend = jQuery.fn.extend = function() { ,extend方法要么是直接挂在 ...
- jquery的2.0.3版本源码系列(7):3043行-3183行,deferred延迟对象,对异步的统一管理
目录 part1 deferred延迟对象 part2 when辅助方法 网盘源代码 链接: https://pan.baidu.com/s/1skAj8Jj 密码: izta part1 defe ...
- jquery的2.0.3版本源码系列(3):96行-283行,给JQ对象,添加一些方法和属性
jquery是面向对象的程序,面向对象就离不开方法和属性. 方法的简化 jQuery.fn=jQuery.prototype={ jquery: 版本 constructor: 修正指向问题 init ...
- jquery的2.0.3版本源码系列(5):349-817行,extend添加的工具方法
expando 生成唯一JQ字符串(内部)noconflict避免冲突isReady DOM是否加载完成(DOMContentLoaded)readyReady
- jQuery源码笔记(二):定义了一些变量和函数 jQuery = function(){}
笔记(二)也分为三部分: 一. 介绍: 注释说明:v2.0.3版本.Sizzle选择器.MIT软件许可注释中的#的信息索引.查询地址(英文版)匿名函数自执行:window参数及undefined参数意 ...
- Kafka 0.10.1版本源码 Idea编译
Kafka 0.10.1版本源码 Idea编译 1.环境准备 Jdk 1.8 Scala 2.11.12:下载scala-2.11.12.msi并配置环境变量 Gradle 5.6.4: 下载Grad ...
- spring各个版本源码
各版本源码下载地址 http://maven.springframework.org/release/org/springframework/spring/
随机推荐
- Samba远程代码执行-分析(CVE-2017-7494)
经历了前一阵windows的EternalBlue之后,某天看见了360的 samba高危预警,这个号称linux端的EternalBlue(EternalRed),于是便研究了一波 概述(抄) Sa ...
- RxSwift 实战操作【注册登录】
前言 看了前面的文章,相信很多同学还不知道RxSwift该怎么使用,这篇文件将带领大家一起写一个 注册登录(ps:本例子采用MVVM)的例子进行实战.本篇文章是基于RxSwift3.0写的,采用的是C ...
- C++学习(八)入门篇——复合类型
数组(需要声明以下三点): (1)存储在每个元素中值的类型 (2)数组名 (3)数组中的元素数 声明数组的通用格式如下: typeName arrayName[arraySize];arraySize ...
- (转)Eclipse快捷键 10个最有用的快捷键
1 Eclipse中10个最有用的快捷键组合 一个Eclipse骨灰级开发者总结了他认为最有用但又不太为人所知的快捷键组合.通过这些组合可以更加容易的浏览源代码,使得整体的开发效率和质量得到提升. 1 ...
- (转)Java多线程之Lock的使用 (待整理)
import java.util.concurrent.ExecutorService; import java.util.concurrent.Executors; import java.util ...
- Oracle RAC 实验环境RMAN备份v1.01
Oracle RAC 实验环境RMAN备份v1.01 环境:RHEL 6.5 + Oracle GI 11.2.0.4 + RAC 11.2.0.4 (2 nodes) 需求:制定RAMN备份策略 版 ...
- 使用Visual Studio Code调试基于ActionScript的LayaAir HTML5游戏
使用Visual Studio Code(VS Code)调试的优势 使用VS Code我们可以极大地提高LayaAir Html5游戏项目的调试效率,VS Code的优势有以下几点: 在发生Java ...
- vue2.0 新手教程
想想自己写vue的项目也写了一年了,从vue1.0到2.0,走过不少路,填过不少坑, 下面记录一下新手从0到1的过程,本文“应该”会持续更新 首先安装vue的运行环境node 1.下载Nodejs并安 ...
- 地铁间谍 洛谷 p2583
题目描述 特工玛利亚被送到S市执行一个特别危险的任务.她需要利用地铁完成他的任务,S市的地铁只有一条线路运行,所以并不复杂. 玛利亚有一个任务,现在的时间为0,她要从第一个站出发,并在最后一站的间谍碰 ...
- Weex入门指南
背景 由于公司项目需要,需求变化频繁,计划总改不上变化,由于app更新版本周期长,不能很好应对这种变化,正在此前提下热修复和热更新技术也有了发展的空间,不管热修复还是热更新,都是对app内容或者逻辑的 ...