今天在写插件,使用

$.extend({}, defaults, options)

的时候发现漏写了 {},浪费了一些时间, 所以详细记录下该方法的 API 和使用。

API 如下:

jQuery.extend( [ deep ], target, [ object1 ], [ objectN ] )

描述:合并两个或更多的对象的内容汇集成到第一个对象。

  • deep:如果是true,合并成为递归(又叫做深拷贝)。

  • target:一个对象,如果附加的对象被传递给这个方法将那么它将接收新的属性,如果它是唯一的参数将扩展 jQuery 的命名空间。

  • object1:一个对象,它包含额外的属性合并到第一个参数

  • objectN:包含额外的属性合并到第一个参数

源码如下:

jQuery.extend = jQuery.fn.extend = function() {
var src, copyIsArray, copy, name, options, clone,
target = arguments[0] || {},
i = 1,
length = arguments.length,
deep = false;
// Handle a deep copy situation
if ( typeof target === "boolean" ) {
deep = target;
target = arguments[1] || {};
// skip the boolean and the target
i = 2;
}
// 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 ( length === i ) {
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 = jQuery.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;
};

关键代码为:

for ( name in options ) {
src = target[ name ];
copy = options[ name ];
if ( deep ) {
clone = src;
target[ name ] = jQuery.extend( deep, clone, copy );
} else {
target[ name ] = copy;
}
}

假如 deep 为

true

,则递归调用 extend 函数,从而实现深度拷贝。

当我们提供两个或多个对象给$.extend(),对象的所有属性都添加到目标对象。

通过代码可以看到目标对象(第一个参数)将被修改,也将通过 $.extend() 返回。

如果我们想保留原对象,我们可以通过传递一个空对象作为目标:

var object = $.extend({}, object1, object2);

jQuery.extend() 使用语法详解相关推荐

  1. jQuery.extend 函数使用详解

    jQuery.extend 函数使用详解 一.总结 一句话总结: jquery $.extend的作用就是:用于将一个或多个对象的内容合并到目标对象:$.extend( target [, objec ...

  2. jQuery Validate验证框架详解

    2019独角兽企业重金招聘Python工程师标准>>> 一.导入js库 <script type="text/javascript" src="& ...

  3. js 正则中冒号代表什么_javascript中正则表达式语法详解

    好久都没有写博客了,主要是太懒了,尤其是在阳春三月,风和日丽的日子,太阳暖暖的照在身上,真想美美的睡上一觉.就导致了这篇博客拖到现在才开始动笔,javascript的正则这一块也不是什么新的东西,主要 ...

  4. php insert什么意思,PHP insert语法详解

    PHP insert语法详解 上次程序中有这么一句话: $exec="insert into info (ename,pcname) values ('".$_POST[" ...

  5. Python的Xpath介绍和语法详解

    1.简介 XPath是一门在XML和HTML文档中查找信息的语言,可以用来在XML和HTML文档中对元素和属性进行遍历 XPath的安装 Chrome插件XPath Helper 点Chrome浏览器 ...

  6. jQuery的deferred对象详解

    阮一峰大神的关于jQuery的deferred对象详解 http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_ ...

  7. FreeMarker基本语法详解及模板文件的组成(二)

    海浪上次给大家分享了FreeMarker基本语法详解及模板文件的组成(一)海浪今天继续分享FreeMarker基本语法详解及模板文件的组成(二) 3.2 输出变量值<?xml:namespace ...

  8. Velocity魔法堂系列二:VTL语法详解

    一.前言 Velocity作为历史悠久的模板引擎不单单可以替代JSP作为Java Web的服务端网页模板引擎,而且可以作为普通文本的模板引擎来增强服务端程序文本处理能力.而且Velocity被移植到不 ...

  9. Java8初体验(二)Stream语法详解(转)

    本文转自http://ifeve.com/stream/ Java8初体验(二)Stream语法详解 感谢同事[天锦]的投稿.投稿请联系 tengfei@ifeve.com 上篇文章Java8初体验( ...

最新文章

  1. confirm修改按钮文字_CAD教程来袭,CAD菜鸟们你知道CAD如何创建和设置文字样式吗?...
  2. Android 一个对sharedpreferences 数据进行加密的开源库
  3. 算法(11)-leetcode-explore-learn-数据结构-链表的经典问题
  4. 使用计算机自带字体怎么用_在家办公不会扫描文件怎么办?用 iPhone 自带软件就搞定啦...
  5. python口号_编程语言的口号
  6. 如何让一个用户拥有root权限
  7. 实习踩坑之路:LocalDateTime计算间隔天数,compareTo/Period的beetween方法导致的bug
  8. ApiDoc 一键生成注释
  9. android gallery效果,Android RecyclerView封装的Gallery效果控件,android galleryview
  10. 使用代码控制小米智能插座
  11. 服务器远程桌面连接不上(远程桌面连接服务器之超级VPS管理器)
  12. python里面snip什么意思_文献检索里面SJR是什么,SNIP指标是什么
  13. 固态硬盘的计算机需要进行磁盘碎片整理吗,有问有答:固态硬盘需要磁盘碎片整理吗?...
  14. Android Killer中apktool插件更新
  15. 一起学Go吧! Go语言反射篇
  16. shader学习摘要(八)unity光源类型
  17. [已解决]Attempt to invoke virtual method 'int android.view.View.getImportantForAccessibility()'
  18. “HIMO CUBE”全新亮相ADM展,海马体照相馆获原创品牌创新奖
  19. java eclipse oxygen_Eclipse 安装(Oxygen版本)
  20. uboot启动的第二阶段分析

热门文章

  1. (3.4)HarmonyOS鸿蒙滑动事件三个动作
  2. android 退出多个activity,Android 中 退出多个activity的经典方法
  3. php imagemagick 文档,调用ImageMagick的PHP函数中文文档
  4. C# NTP时间同步类
  5. sqlserver 存储过程 C#调用 实现从数据库Get数据
  6. vim选中字符复制/剪切/粘贴
  7. jmeter插件监控cpu小节点
  8. 滨河新区(黄河楼)夜景
  9. 狸猫换太子:动态替换WinCE的原生驱动!
  10. 江苏省专转本计算机题知识点,江苏专转本计算机真题17