jquery源码特点

Ⅰ 如何正确阅读jquery源码和jquery插件源码

1. jQuery 里面有很多东西是出于兼容性，历史遗留。

比如 .ready() 之类的函数，为什么会很scroll 有关，那是为了兼容某些ie。这种代码对于编程思想来说不仅没用，而且是杂音，你要筛选出来就得了解这段代码的变动，费心费力得不偿失。

2. jQuery 里面的代码不一定是最优的，例如事件委托，每一次事件触发都要调用选择器，实际上是效率很低的。但是我又比较懒，没有提交patch。

3. jQuery 实际上很容易写出来一个 barebone alternative，在使用的过程中多想，多思考多总结就可以了。

4. jQuery 这类框架里真正有思维挑战性的东西不多，一半以上是堆代码而已，剩下的一点价值在于架构、抽象、扩展能力。

5. 我有一句话与所有的同行分享：工程师让需求成为现实，优秀工程师化复杂为简单，顶尖工程师变不可能为可能；架构师掌握现在，优秀架构师展望未来，顶尖架构师创造时代。

jQuery 的设计目的是，让前端工程师的工作更简单更轻松，但它并不适合所有的前端工程师，假如你的目标是成为优秀架构师、顶尖架构师的话，你在jQuery里也看不清未来。

Ⅱ 完全理解jQuery源代码，在前端行业算什么水平

依读了2周jQuery源码的人感觉来说，完全理解jQuery，就拿jQuery 1.11这个版本10337行代码来说，水平已经很不错了。谦虚点说，已经入门。骄傲点，国内领先水平。但其码我感觉是js架构之路起行的第一步，完全理解源码，说明有独立构建或组织大型web前端框架的能力和基础。然后看看完全理解jQuery是一个怎么样的状态。

看下面几个链接就明白了：
RubyLouvre/avalon · GitHub
artDialog
aui/artDialog · GitHub(后来的新版代码有所改变)
没错，这两个里边，就是在继承jquery的基础上做了自己的创新尝试。
然后在看下面这位：
[原创] jQuery1.6.1源码分析系列（停止更新）
是唯一出过jquery源码分析书的一位：
《jQuery技术内幕：深入解析jQuery架构设计与实现原理》(高云)【摘要 书评 试读】
然后在看这位：
jQuery 2.0.3 源码分析系列
是目前一直在更新的一位，通俗有深度且版本比较新。
在说一下我2周阅读jquery源码的心得，初看源码写的恶心，再看写的不错，细看写的真是精妙。然后今天在看ext 4.2的源码，真是流畅易读。基本来说，看懂jQuery源码，以后的源码学习之路可以说，平坦。
然后说是不是高手，高手只是一个自我定位的心理暗示，是一种人格魅力的体现，是业务与技术的完美结合。个人感觉只能无限的接近，不能在有限的生命里边到达。我们在通往目的地过程中享受一路的风景，这才是生命的意义。
然后在说前端，前端的核心是js，外围打酱油的技术太多，不一一列举。

css就像一瓶酒，得品。

html,css总共就那些标签跟选择器属性什么的，但是要写一个有扩展性，健壮性或维护性的页面不容易。现在写页面基本条件反射，不是如何快速的完成，而是思考如果有前端界面需求修改，怎么在修改代码最少的情况下完成整体需求任务。

js就像一把剑，得磨。
js刚开始只是为了较验，随便技术社会的发展，承担的角色越来越重，刚开始玩玩jQuery感觉已经会js了，其实只是冰山一角。随着对js的了解越来越多，他即变态又可爱，即好玩又难控，即有很多兼容问题，但解决兼容是我们基本生存之道。

人生就是一场梦，得作。

技术只是生活的一部分，曾经雄心斗志，如今低头写码。改变能改变的，接受不能改变的。人生有限，兄争朝夕啊。
最后说，什么时候能阅读jQuery源码，我感觉其码是纯js编码一年以上，js基础知识没有盲点。阅读源码，确实能学到很多东西。不只是技术，而是一种生活的态度。一种把一件事情做到极致的态度

Ⅲ jquery源码 ，jquery选择器，javascript，正则表达式

quickExpr应该是个二义正则。前半段是:
^[^<]*(<[\w\W]+>)[^>]*$:我猜测意思是一个简单的标签。如$('<div>new Div</div>')匹配的用法。
后半段是:
^#([\w-]+)$:这个显然就是id选择器。->getElementById
注意两个正则用了|来分隔二义,所以你这里的匹配不成功是正常的。
jquery应该是根据这个quickExpr来判断
if(match[1]) createNewfragment();....
else if(match[2]) getElementById();
当然这只是个人猜测,没有细读jquery源码。仅做参考

Ⅳ 为何jQuery源码哪么复杂

说jquery源码复杂，是因为你基础不结实。多看点基础知识吧。

Ⅳ 如何高效地阅读 jQuery 源码

尝试把jquery拆分为ecma扩展(以及emitter promise和queue)，dom兼容性问题(compressed && gziped 小于14k，尝试理解哪些函数我不提供兼容性就不能使用，哪些我可以接受原生写法，同时包括一个自己写的css3选择器) , 链式调用(尝试理解用户需求，理解怎么写方便)，动画库(你是不是可以jq和css3兼容呢)

Ⅵ jquery源码是否尝试去读过

有啊，我还看过别人中文解释他的源码，不愧是高手写的代码，很注重细节。有机会真的可以去看看，对你以后写小型框架很有帮助。如果想看源码注释，可以直接发Q给我，我发给你。

Ⅶ jQuery 源代码看不懂，怎么办。。有没有解释jQuery 源代码的书籍

要不要阅读别人代码？
要。
阅读别人代码干什么？
提高自己的代码质量。
试图通过阅读别人代码找出代码的逻辑？
错误。
试图通过阅读别人代码找出想要实现自己的逻辑的代码？
正确，只有遵循了这个原则，才能实现物为我所用。
毫无目的去看别人代码 不晕才怪呢。

Ⅷ jquery和javascript有什么区别

JavaScript 是一种脚本语言，主要用在浏览器中，实现对网页的文档对象的操作和一些用户交互动作的处理。

而 jQuery 则是 JavaScript 的一个代码库（或习惯性叫类库），它将一些在 JavaScript 开发中经常用到的功能集合起来，以方便开发者直接使用，而不需要再用原生 JavaScript 语句写大量代码，同时可在不同浏览器间实现一致的效果。是当前最流行的 JavaScript 库之一。

(8)jquery源码特点扩展阅读：

jquery和javascrip都是脚本语言，

脚本语言又被称为扩建的语言，或者动态语言，是一种编程语言，用来控制软件应用程序，脚本通常以文本（如ASCII)保存，只在被调用时进行解释或编译。

特点：

1、脚本语言(JavaScript，VBscript等)介于HTML和C,C++,Java,C#等编程语言之间。HTML通常用于格式化和链接文本。而编程语言通常用于向机器发出一系列复杂的指令。

2、脚本语言与编程语言也有很多相似地方，其函数与编程语言比较相像一些,其也涉及到变量。与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些.

3、与程序代码的关系：脚本也是一种语言，其同样由程序代码组成。

4、脚本语言是一种解释性的语言,例如Python、vbscript,javascript,installshield script,ActionScript等等,它不象cc++等可以编译成二进制代码,以可执行文件的形式存在，脚本语言不需要编译，可以直接用，由解释器来负责解释。

5、脚本语言一般都是以文本形式存在,类似于一种命令。

举个例子说：如果建立了一个程序,叫aaa.exe，可以打开.aa为扩展名的文件，为.aa文件的编写指定了一套规则(语法)，当别人编写了.aa文件后，自己的程序用这种规则来理解编写人的意图，并作出回应，那么，这一套规则就是脚本语言。

6、相对于编译型计算机编程语言：用脚本语言开发的程序在执行时，由其所对应的解释器（或称虚拟机）解释执行。系统程序设计语言是被预先编译成机器语言而执行的。脚本语言的主要特征是：程序代码即是脚本程序，亦是最终可执行文件。脚本语言可分为独立型和嵌入型，独立型脚本语言在其执行时完全依赖于解释器，而嵌入型脚本语言通常在编程语言中（如C，C++，VB，Java等）被嵌入使用。

7、和系统程序设计语言相比：不同是脚本语言是被解释而系统程序设计语言是被编译。被解释的语言由于没有编译时间而提供快速的转换，通过允许用户运行时编写应用程序，而不需要耗时的编译/打包过程。解释器使应用程序更加灵活，脚本语言的代码能够被实时生成和执行。脚本语言通常都有简单、易学、易用的特性，目的就是希望能让程序设计师快速完成程序的编写工作。

参考资料：网络-脚本语言

Ⅸ $到底是什么-详解jQuery的$符号和init函数

jQuery是现在最流行的Javascript框架， $是其中最常见的符号，已经在jQuery留下了深深的烙印。 接下来我会彻底分析这个符号背后隐藏的秘密。jQuery，高效，精炼，特别是对DOM元素对象操作的简化，很大程度上将前端程序员从一大堆冗余的代码解放出来，大大提高了开发效率！对多浏览器的兼容性，也最大限度让程序员摆脱各种bug的纠缠$符号作为元素选择器的简写，最早是由Prototype库使用，来简写getElementById，jQuery沿袭这一理念，并发扬光大，使$符号成为了jQuery最别具一格的特点。那么在jQuery中，$符号到底是啥？熟悉jQuery的人应该知道，几乎jQuery所有操作，都是从$符号开始，当作为元素选择器的时候，操作结果返回的是一个jQuery对象。 那么，现在就看jQuery类的构造函数的主要代码jQuery对象的构造函数 var jQuery = (function() { //创建jQuery对象,给所有的jQuery方法提供统一的入口,避免繁琐难记 var jQuery = function( selector, context ) { //jQuery的构造对象,调用了jQuery.fn.init方法 //最后返回jQuery.fn.init的对象 return new jQuery.fn.init( selector, context, rootjQuery ); }, ..... //定义jQuery的原型,jQuery.fn指向jQuery.prototype对象 jQuery.fn = jQuery.prototype = { //重新指定构造函数属性,因为默认指向jQuery.fn.init constructor: jQuery, init: function( selector, context, rootjQuery ) {.....}, ...... } ...... //返回jQuery变量,同时定义将全局变量window.jQuery和window.$指向jQuery return (window.jQuery = window.$ = jQuery); })(); 从以上jQuery的主体结构，我们可以看出，当首次执行完毕后，全局变量$和jQuery，都是指向了var jQuery=function（selector，context）{}这个函数，这里，就可以下个结论，$就是jQuery的别名，实际调用jQuery.fn.init。再看看var jQuery=function（selector，context）{}这个构造函数，为什么里面不直接返回jQuery的对象？而是调用另外一个方法呢？假如直接返回对象的话，每次使用jQuery对象，都要new jQuery() 这样的话，十分不方便，直接将new 这个操作封装在jQuery构造函数里面，简化了实例化的操作，同时，jQuery通过了jQuery或者$符号，统一了接口，方便代码的编写，化繁为简，提高效率。那么jQuery类具体是如何构造的？居然能支持各种参数形式的调用 直接上jQuery.fn.init的“辕马”，jQuery的真实构造器，我们就可以完全清楚了init源码 /*所有查找或生成元素的结果，封装为jQuery对象数组返回. */ init: function( selector, context, rootjQuery ) { var match, elem, ret, doc; // 1)处理 $(""), $(null), or $(undefined) //this指向jQuery对象 if ( !selector ) { return this; } // 2)处理 $(DOMElement) //selector.nodeType得知为DOM元素,如果是DOM元素直接放进jQuery对象数组中 if ( selector.nodeType ) { this.context = this[0] = selector; this.length = 1; return this; } //3)body元素只出现一次, 优化查找 if ( selector === "body" && !context && document.body ) { this.context = document; this[0] = document.body; this.selector = "body"; this.length = 1; return this; } //4)如果是字符串,有六种情况, /* *(1)单个html元素 不带属性对象字面量 ：createElement + merge *(2)单个html元素 带属性对象字面量 ：createElement + attr + merge *(3)多个html元素 ：buildFragment + merge *(4)#id 不带context ：getElementById或者getElementById + Sizzle *(5)#id 带context ：Sizzle *(6)experession string ：Sizzle *(7)标签选择器 ：Sizzle（内置getElementByTagName） */ if ( typeof selector === "string" ) { // 判断是否为HTML string 还是 ID //如果是HTML strings match[1] 非空 //如果是ID strings match[1] 空 //quickExpr = /^(? jQuery.clone(ret.fragment) : ret.fragment).childNodes; } //将生成结果selector 合并到jQuery对象中 return jQuery.merge( this, selector ); // 处理$("#id"),例如$("#xxx"); } else { elem = document.getElementById( match[2] ); if ( elem && elem.parentNode ) { //处理IE和Opera ID 与 Name 混淆的bug,使用Sizzle查找 if ( elem.id !== match[2] ) { return rootjQuery.find( selector ); } // 否则，简单插入jQuery对象数组 this.length = 1; this[0] = elem; } this.context = document; this.selector = selector; return this; } // 处理 $(expr, $(...))，使用Sizzle查找，例如$("div"),$('div > a'),$('div,a'),$('div:first') } else if ( !context || context.jquery ) { return (context || rootjQuery).find( selector ); // 处理: $(expr, context),例如$('div a');或者$('a','div')或者$('div').find('a'); } else { return this.constructor( context ).find( selector ); } //5)处理: $(function),设置DOM载的时候绑定的函数,等同于$().ready(){foo} } else if ( jQuery.isFunction( selector ) ) { return rootjQuery.ready( selector ); } //6)处理：$($(...))，完成克隆jQuery对象的简单参数，具体由makeArray完成 if (selector.selector !== undefined) 完成加{ this.selector = selector.selector; this.context = selector.context; } //使用makeArray，为jQuery对象添加元素,例如$([1,2]); return jQuery.makeArray( selector, this ); }, 从源码可以看出，jQuery 通过各种条件判断和强大的正则表达式，实现了各种参数的调用。

Ⅹ 逐行分析jquery源码的奥秘 一共多少节

看完之后对对象和原型的理解帮助会非常大。
但最好等用jquery比较熟悉之后再看源码，那么会对理解比较有好处，也会比较容易看懂。

最好从jquery核心处开始看，看懂$.fn.init以及基本方法之后再看别的$.extend的时候就比较容易了。