菜鸟看jquery源码(2)
来源:互联网 发布:租赁软件哪个好 编辑:程序博客网 时间:2024/05/16 12:48
第一篇提到了jquery的核心部分就在于自执行函数传入的第二个参数,factory,其实就是一个函数。jquery的源码一万多行,一点点顺着读下去把。
function( window, noGlobal ) {"use strict";//拿到数组和对象的原生方法var arr = [];var document = window.document;var getProto = Object.getPrototypeOf;var slice = arr.slice;var concat = arr.concat;var push = arr.push;var indexOf = arr.indexOf;var class2type = {};var toString = class2type.toString;var hasOwn = class2type.hasOwnProperty;var fnToString = hasOwn.toString;var ObjectFunctionString = fnToString.call( Object );var support = {}; function DOMEval( code, doc ) { doc = doc || document; var script = doc.createElement( "script" ); script.text = code; doc.head.appendChild( script ).parentNode.removeChild( script ); }//这个函数很有意思建一个script标签,把传入的code塞进script标签,把这个script标签塞插入到document里面然后又立即移除这个script标签。看起来这个函数像是把一段代码在全局中立即调用然后又从全局中立即销毁。后面遇到调用这个函数,再回头看。/* global Symbol */// Defining this global in .eslintrc.json would create a danger of using the global// unguarded in another place, it seems safer to define global only for this module//这里开始定义jquery相关的东西var version = "3.2.1",//版本号 // Define a local copy of jQuery jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' // Need init if jQuery is called (just allow error to be thrown if not included) return new jQuery.fn.init( selector, context ); }, //这个方法是jquery的核心,在源码的最后jquery又赋值给$,所以每次用jquery('#id')或者是$('#id')的时候,都是直接调用这个方法。该方法返回一个jQuery.fn.init的一个实例。 // Support: Android <=4.0 only // Make sure we trim BOM and NBSP rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, // Matches dashed string for camelizing rmsPrefix = /^-ms-/, rdashAlpha = /-([a-z])/g, //正则不太懂 // Used by jQuery.camelCase as callback to replace() fcamelCase = function( all, letter ) { return letter.toUpperCase(); }; //这种把字符串变成大写的小函数,用到再回头看 //上面jquery的方法中用到jquery.fn,可以看到jquery.fn其实就是jQuery这个构造函数的原型,看看原型中大致定义了什么 jQuery.fn = jQuery.prototype = { // The current version of jQuery being used jquery: version, //这种定义在原型上的属性和方法,在有引入jQuery文件的网页中,用jQuery.prototype就能访问到 constructor: jQuery, //原型用对象形式完全重写,要把constructor这个属性重新指向jQuery // The default length of a jQuery object is 0 length: 0, toArray: function() { return slice.call( this ); }, // Get the Nth element in the matched element set OR // Get the whole matched element set as a clean array get: function( num ) { // Return all the elements in a clean array if ( num == null ) { return slice.call( this ); } // Return just the one element from the set return num < 0 ? this[ num + this.length ] : this[ num ]; }, // Take an array of elements and push it onto the stack // (returning the new matched element set) pushStack: function( elems ) { // Build a new jQuery matched element set var ret = jQuery.merge( this.constructor(), elems ); // Add the old object onto the stack (as a reference) ret.prevObject = this; // Return the newly-formed element set return ret; }, // Execute a callback for every element in the matched set. each: function( callback ) { return jQuery.each( this, callback ); }, map: function( callback ) { return this.pushStack( jQuery.map( this, function( elem, i ) { return callback.call( elem, i, elem ); } ) ); }, slice: function() { return this.pushStack( slice.apply( this, arguments ) ); }, first: function() { return this.eq( 0 ); }, last: function() { return this.eq( -1 ); }, eq: function( i ) { var len = this.length, j = +i + ( i < 0 ? len : 0 ); return this.pushStack( j >= 0 && j < len ? [ this[ j ] ] : [] ); }, end: function() { return this.prevObject || this.constructor(); }, // For internal use only. // Behaves like an Array's method, not like a jQuery method. push: push, sort: arr.sort, splice: arr.splice //上面定义了很多方法,像常用的eq,get之类的,具体内容先不解释,目前主线是先找到jQuery.fn.init是怎么定义的,这个才是jquery构造函数的核心所在。};
本章讲了jquery构造函数,以及在构造函数的原型上的方法。下一章说一下extend这个方法。
阅读全文
0 0
- 菜鸟看jquery源码(2)
- 菜鸟看源码之ArrayList
- 菜鸟看源码之HashMap
- 菜鸟看源码之LinkedList
- 菜鸟看源码之HashTable
- 看jQuery源码有感
- 菜鸟看php内核源码第三章
- 菜鸟nginx源码剖析 框架篇(一) 从main函数看nginx启动流程
- 菜鸟nginx源码剖析 框架篇(一) 从main函数看nginx启动流程
- 菜鸟看“菜鸟网络”
- 在看jQuery源码,jQuery.each()写的非常精粹
- jQuery源码初探(2)
- 菜鸟看I/O!!
- 菜鸟看代码江湖
- 菜鸟看“电商”
- 菜鸟看“电商”
- Java程序员从笨鸟到菜鸟之(九十八)深入java虚拟机(七)深入源码看java类加载器ClassLoader
- 菜鸟看spring源码(0)之BeanFactory的注册与依赖绑定
- 36.判断数独是否合法
- urlib2下载网页的三种方法
- HTTP协议—— 简单认识TCP/IP协议
- StringBuffer和StringBuilder的区别
- 无锁队列的实现
- 菜鸟看jquery源码(2)
- Android开发用Intent跳转到系统应用大全总结
- 关于Js的isNaN()函数
- 常用SQL命令
- eclipse/android studio下如何使用第三方模拟器
- Ubuntu安装cuDNN
- Unique Paths II
- SPI协议及其工作原理浅析
- find the mincost route