`
心语2012
  • 浏览: 45605 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

解读jquery的extend

 
阅读更多

jQuery的extend方法很有用,jquery的很多工具方法,和实例方法都是通过extend实现的。我们一起来看一下

这个方法是怎么写的。

  jQuery.extend = jQuery.fn.extend = function() {

var options, name, src, copy, copyIsArray, clone,

3target = arguments[0] || {},

i = 1,

length = arguments.length,

deep = false;

 

// Handle a deep copy situation

if ( typeof target === "boolean" ) {

deep = target;

 

// skip the boolean and the target

target = arguments[ i ] || {};

i++;

}

 

// Handle case when target is a string or something (possible in deep copy)

if ( typeof target !== "object" && !jQuery.isFunction(target) ) {

target = {};

}

 

// extend jQuery itself if only one argument is passed

if ( i === length ) {

target = this;

i--;

}

 

for ( ; i < length; i++ ) {

// Only deal with non-null/undefined values

if ( (options = arguments[ i ]) != null ) {

// Extend the base object

for ( name in options ) {

src = target[ name ];

copy = options[ name ];

 

// Prevent never-ending loop

if ( target === copy ) {

continue;

}

 

// Recurse if we're merging plain objects or arrays

if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = 29jQuery.isArray(copy)) ) ) {

if ( copyIsArray ) {

copyIsArray = false;

clone = src && jQuery.isArray(src) ? src : [];

 

} else {

clone = src && jQuery.isPlainObject(src) ? src : {};

}

 

// Never move original objects, clone them

target[ name ] = jQuery.extend( deep, clone, copy );

 

// Don't bring in undefined values

} else if ( copy !== undefined ) {

target[ name ] = copy;

}

}

}

}

 

// Return the modified object

return target;

 };

 

我们看第一行,jQuery.extend = jQuery.fn.extend ,前边又有定义jQuery.fn = jQuery.prototype,所以就是通过jQuery.fn.extend实现向jQuery添加实例方法,通过jQuery.extend向jQuery添加工具方法。

首选通过target = arguments[0] || {}取得第extend的第一个参数为目标对像,后边又判断如果typeof target === "boolean" 如果第一个参数是boolean的话说明是深拷贝,那么目标对像为第二个参数 target = arguments[ i ] || {} ;i++。如果参数只有一个的话那么目录对像就是jQuery或者是jQuery.prototype,

那么以下内容就是遍历除参数,把每个对像参数的属性拷贝到目标对像上,如果第一个参数是true的话就用递归实现深拷贝

 

 

分享到:
评论

相关推荐

    jQuery源码解读

    在源码解读中,我们可以看到jQuery的设计思路和实现机制。 首先,jQuery的核心设计是基于JavaScript的闭包特性,以避免命名冲突。整个jQuery库被包裹在一个立即执行的匿名函数中,这样可以确保其中定义的所有函数和...

    解读jQuery插件开发流程_.docx

    ### 解读jQuery插件开发流程 #### 插件开发背景与意义 随着Web技术的发展,JavaScript作为前端开发的重要工具之一,其重要性不言而喻。jQuery作为一个流行的JavaScript库,因其简便性和强大的功能深受开发者喜爱。...

    老司机带你解读jQuery插件开发流程

    jQuery插件开发主要有三种模式,分别是通过`$.extend()`扩展jQuery,通过`$.fn`向jQuery添加新方法,以及使用`$.widget()`方法结合jQuery UI创建。通常情况下,开发者更常使用的是通过`$.fn`添加新方法的模式,因为...

    jQuery源码解读之extend()与工具方法、实例方法详解

    本文实例讲述了jQuery源码解读之extend()与工具方法、实例方法。分享给大家供大家参考,具体如下: 使用jQuery的时候会发现,jQuery中有的函数是这样使用的: $.get(); $.post(); $.getJSON(); 有些函数是这样使用...

    jquery源码框架解读

    《jQuery源码框架解读》 在前端开发领域,jQuery是一个不可或缺的库,它极大地简化了JavaScript操作DOM、处理事件、创建动画以及实现Ajax交互。这份资料深入解析了jQuery的源码,旨在帮助开发者理解其内部机制,...

    jQuery-, jQuery源码解读 -- jQuery v1.10.2.zip

    通过研究`$.fn.extend()`和`$.extend()`,我们可以学习如何编写自己的jQuery插件,以扩展其功能。 8. **性能优化** jQuery v1.10.2在性能上进行了多方面的优化,包括DOM操作的最小化、缓存机制的使用等。通过源码...

    jQuery核心源码中文注释解读

    以下是对jQuery核心源码的中文注释解读: 首先,jQuery的源码通常以一个立即执行的匿名函数开始,这样做是为了避免命名冲突。JavaScript中没有严格的命名空间,因此将所有代码包裹在一个匿名函数内,可以限制其作用...

    jquery帮助文档解析

    通过`$.fn.extend()`方法,开发者可以创建自己的jQuery插件,方便复用和分享代码。 ### 8. 性能优化 理解jQuery的性能优化技巧至关重要。避免全局查找,使用ID选择器而非类选择器,以及利用缓存结果(如`var $elem...

    Jquery 源码解读

    ### Jquery 源码解读 #### 一、概述 jQuery 是一款优秀的 JavaScript 库,以其简洁、高效著称,极大地简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。本文旨在深入解析 jQuery 的核心部分,帮助读者...

    jQuery中extend函数详解

    在jQuery中,有一个非常重要的函数,即extend函数,它用于将一个或多个对象的内容合并到目标对象中。本文将详细解释jQuery中的extend函数,以及代码混淆与压缩的概念。 ### jQuery.extend()函数 在jQuery中,...

    jQuery:jQuery 源码解读 -- jQuery v1.10.2

    以下是对jQuery源码的深度解读。 ### 1. 兼容性处理 jQuery从诞生之初就致力于解决JavaScript在不同浏览器之间的兼容问题。在v1.10.2中,jQuery通过`jQuery.fn.init`初始化函数处理了各种浏览器差异,比如`...

    Jquery 源代码分析

    本文将针对jQuery 1.2.6版本的源代码进行详细的解读,帮助读者理解其内部机制,提升JavaScript编程技能。 一、jQuery核心概念 1. **选择器引擎(Sizzle)**:jQuery的核心之一是选择器引擎Sizzle,它负责解析CSS...

    jquery开发入门整理(所需要了解的)

    jQuery包含了一系列工具函数,如`$.each()`、`$.extend()`等,这些函数可以帮助开发者更加高效地处理数据和实现某些特定功能。例如: - `$.each(array, callback)`:遍历数组或对象,并对每个元素执行指定的回调...

    jquery源码_详细中文注释.pdf.zip_jquery_js pdf 批注_pdf注释

    这份源码解读将帮助我们理解jQuery如何实现这一目标。 首先,我们关注jQuery的构造函数`jQuery()`,它是整个库的入口点。在这里,它处理了各种输入类型,如字符串(选择器)、元素、HTML片段等,并创建了jQuery对象...

    jQuery_1.6_中文API

    本篇文章将详细解读jQuery 1.6版本的中文API,帮助开发者深入理解和应用这个强大的工具。 一、jQuery选择器 jQuery的选择器是其核心功能之一,它允许开发者通过CSS1-3选择器、ID选择器、类选择器、属性选择器等多种...

    jQuery 源碼解讀

    《jQuery 源码解读》 jQuery,作为一个广泛使用的JavaScript库,它的源代码凝聚了无数开发者的心血,其高效、简洁的设计理念深受程序员喜爱。深入理解jQuery源码,不仅可以提升我们的JavaScript技能,还能帮助我们...

    jquery基础教程(第2版)的源代码

    以下是对这些源代码中关键知识点的详细解读: 1. **DOM操作**:jQuery提供了简洁的API来选取和操作HTML元素。如`$()`函数用于选取元素,`$(selector).html()`、`.text()`和`.attr()`用于获取或设置元素的内容和属性...

Global site tag (gtag.js) - Google Analytics