还记不记得jQuery初始化函数jQuery.fn.init中有这样是一个分支 //document ready简便写法$(function(){…}) } else if ( jQuery.isFunction( selector ) ) {return rootjQuery.ready( selector ); }所以$(fn)===$(document).ready(fn)。来看一下jQuery.fn.ready的源码 ready: function( fn ) {// Add the callbackjQuery.ready.promise().done( fn );return this; } 很明显在jQuery.ready.promise函数中设置了延时，当延时对象解...
DOM操作包括append、prepend、before、after、replaceWith、appendTo、prependTo、insertBefore、insertAfter、replaceAll。其核心处理函数是domManip。DOM操作函数中后五种方法使用的依然是前面五种方法，源码 jQuery.each({appendTo: "append",prependTo: "prepend",insertBefore: "before",insertAfter: "after",replaceAll: "replaceWith"}, function( name, original ) {jQuery.fn[ name ] = function( selector ) {var elems...
在上篇文章给大家介绍了jQuery-1.9.1源码分析系列（十）事件系统之事件体系结构，本篇继续给大家介绍jquery1.9.1源码分析系列相关知识，具体内容请看下文吧。 首先需要明白，浏览器的原生事件是只读的，限制了jQuery对他的操作。举个简单的例子就能明白为什么jQuery非要构造一个新的事件对象。在委托处理中，a节点委托b节点在a被click的时候执行fn函数。当事件冒泡到b节点，执行fn的时候上下文环境需要保证正确，是a节点执行了fn而...
事件绑定的方法有很多种，使用了jquery那么原理那种绑定方式(elem.click = function(){...}))就不太想推荐给大家了。最主要的原因是elem.click=fn这种方式只能绑定一个事件处理，多次绑定的只会保留最后一次绑定的结果。 下面给大家介绍jquery绑定事件的方式有哪些吧。代码如下: jQuery.fn.eventType([[data,] fn])比如eventType指的是事件类型，比如click: $("#chua").click(fn); data这个参数一般都不会使用。这种方式事件绑定在...
又是一个重磅功能点。在分析源码之前分析一下体系结构，有助于源码理解。实际上在jQuery出现之前，Dean Edwards的跨浏览器AddEvent()设计做的已经比较优秀了；而且jQuery事件系统的设计思想也是基于该思想的，所以我们先分析一下Dean Edwards前辈的事件绑定。 a. jQuery事件原型——Dean Edwards的跨浏览器AddEvent()设计源码解读 //事件添加方法 function addEvent(element, type, handler) {//保证每个不同的事件响应函数只有唯一...
前言 本章我们要讲解的是S.O.L.I.D五大原则JavaScript语言实现的第5篇，依赖倒置原则LSP（The Dependency Inversion Principle ）。 英文原文：http://freshbrewedcode.com/derekgreer/2012/01/22/solid-javascript-the-dependency-inversion-principle/ 依赖倒置原则 依赖倒置原则的描述是： A. High-level modules should not depend on low-level modules. Both should depend on abstractions. 高层模块不应该依赖于低层模...
介绍 本章，我们将讲解在ECMAScript向函数function传递参数的策略。 计算机科学里对这种策略一般称为“evaluation strategy”（大叔注：有的人说翻译成求值策略，有的人翻译成赋值策略，通看下面的内容，我觉得称为赋值策略更为恰当，anyway，标题还是写成大家容易理解的求值策略吧），例如在编程语言为求值或者计算表达式设置规则。向函数传递参数的策略是一个特殊的case。 http://dmitrysoshnikov.com/ecmascript/chapter-8-eval...
前言 本章我们要讲解的是S.O.L.I.D五大原则JavaScript语言实现的第4篇，接口隔离原则ISP（The Interface Segregation Principle）。 英文原文：http://freshbrewedcode.com/derekgreer/2012/01/08/solid-javascript-the-interface-segregation-principle/ 注：这篇文章作者写得比较绕口，所以大叔理解得也比较郁闷，凑合着看吧，别深陷进去了 接口隔离原则的描述是：代码如下: Clients should not be forced to depend on methods ...
介绍 本篇主要是介绍创建对象方面的模式，利用各种技巧可以极大地避免了错误或者可以编写出非常精简的代码。 模式1：命名空间（namespace） 命名空间可以减少全局命名所需的数量，避免命名冲突或过度。一般我们在进行对象层级定义的时候，经常是这样的：代码如下: var app = app || {}; app.moduleA = app.moduleA || {}; app.moduleA.subModule = app.moduleA.subModule || {}; app.moduleA.subModule.MethodA = function () { ...
介绍 本文介绍的四种代码复用模式都是最佳实践，推荐大家在编程的过程中使用。 模式1：原型继承 原型继承是让父对象作为子对象的原型，从而达到继承的目的：代码如下: function object(o) { function F() { } F.prototype = o; return new F(); } // 要继承的父对象 var parent = { name: "Papa" }; // 新对象 var child = object(parent); // 测试 console.log(child.name); // "Papa"// 父构造函数 function...
介绍 本篇主要是介绍创建对象方面的模式的下篇，利用各种技巧可以极大地避免了错误或者可以编写出非常精简的代码。 模式6：函数语法糖 函数语法糖是为一个对象快速添加方法（函数）的扩展，这个主要是利用prototype的特性，代码比较简单，我们先来看一下实现代码：代码如下: if (typeof Function.prototype.method !== "function") { Function.prototype.method = function (name, implementation) { this.prototype[n...
介绍 在本篇文章，我们考虑在ECMAScript中的面向对象编程的各个方面（虽然以前在许多文章中已经讨论过这个话题）。我们将更多地从理论方面看这些问题。 特别是，我们会考虑对象的创建算法，对象（包括基本关系 - 继承）之间的关系是如何，也可以在讨论中使用（我希望将消除之前对于JavaScript中OOP的一些概念歧义）。 英文原文：http://dmitrysoshnikov.com/ecmascript/chapter-7-1-oop-general-theory/ 概论、范式与思想 在进行EC...
介绍 本篇主要是介绍Function方面使用的一些技巧（上篇），利用Function特性可以编写出很多非常有意思的代码，本篇主要包括：回调模式、配置对象、返回函数、分布程序、柯里化（Currying）。 回调函数 在JavaScript中，当一个函数A作为另外一个函数B的其中一个参数时，则函数A称为回调函数，即A可以在函数B的周期内执行（开始、中间、结束时均可）。 举例来说，有一个函数用于生成node代码如下: var complexComputation = function...
介绍 任何编程都提出代码复用，否则话每次开发一个新程序或者写一个新功能都要全新编写的话，那就歇菜了，但是代码复用也是有好要坏，接下来的两篇文章我们将针对代码复用来进行讨论，第一篇文避免篇，指的是要尽量避免使用这些模式，因为或多或少有带来一些问题；第二排是推荐篇，指的是推荐大家使用的模式，一般不会有什么问题。 模式1：默认模式 代码复用大家常用的默认模式，往往是有问题的，该模式使用Parent()的构造函数创建...
介绍 本篇我们介绍的一些模式称为初始化模式和性能模式，主要是用在初始化以及提高性能方面，一些模式之前已经提到过，这里只是做一下总结。 立即执行的函数 在本系列第4篇的《立即调用的函数表达式》中，我们已经对类似的函数进行过详细的描述，这里我们只是再举两个简单的例子做一下总结。代码如下: // 声明完函数以后，立即执行该函数 (function () { console.log(watch out!); } ()); //这种方式声明的函数，也可以立即执行...