本文是在JavaScript之三里面链接内容的中文翻译。我会尽可能做到信达雅且保持作者原意不变,OK,let's Go!

  

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

  jQuery.extend(目标对象,对象1,对象N)

    概述:合并2个或以上的对象属性到第一个对象上。(此处的意思就是将对象1对象N的属性合并到目标对象上,这里是直译的)

       jQuery.extend(目标对象,对象1,对象N)

         目标对象:

         类型:object

         接收传进来的其他对象的属性或者当它是唯一参数时,扩展jQuery命名空间

         对象1

         类型:object

         包含要合并的额外属性

         对象N

         类型:object

         包含要合并的额外属性

       jQuery.extend([deep],目标对象,对象1,[对象N])  

         对象1

         类型:Boolean

         如果为true,则变为递归合并(又叫深度复制 [deep copy])

         目标对象:

         类型:object

         被扩展对象,接收新属性

         对象1

         类型:object

         包含要合并的额外属性

         对象N

         类型:object

         包含要合并的额外属性

  当2个或更多对象参数被添加到$.extend()里面时,所有这些对象的属性都会被合并到目标对象,如果参数为null或undefined时,则会被忽略。

  如果$.extend()里只有1个参数,则意味着目标对象被省略了,在此种情况下,jQUery对象本身会被当做目标对象。这样的话,你可以添加新方法到jQUery命名空间内,这对想要给jQUery添加新方法的插件开发者来说非常有用。

  注意:目标对象将会被修改然后被返回,但如果你想保留所有的初始对象,可以传递一个{}作为目标对象。//见最后一个例子

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

  通过$.extend()执行的合并默认情况下是非递归的,但如果前一个对象的属性本身是array或object类型,那么这个属性就会被第二个以及随后的具有同属性名的对象重写,他们的值不会合并,这在下面的例子中通过检查banana的值可以看到。但如果第一个方法参数传递的是true,则将会被递归合并。

  注意:不支持传递false给第一个参数。

  未定义属性不会被复制,但从原型中继承过来的属性则可以被复制,通过构造函数或者JavaScript类型比如 Date or RegExp创建的对象的属性不会被重建,而且将作为结果对象或数组的简单对象。

  在深度扩展中,Object 和 Array将会被扩展,但原始类型封装的对象比如 String, Boolean, 和 Number则不会,深度扩展周期数据结构将会导致错误。

  如果有超出这些方法的需求,只能用自定义方法来替代,或者是使用一个像lodash那样的库。

  

  案例:

  合并2个对象,修改第一个对象

 <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.extend demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body> <div id="log"></div> <script>
var object1 = {
apple: 0,
banana: { weight: 52, price: 100 },
cherry: 97
};
var object2 = {
banana: { price: 200 },
durian: 100
}; // Merge object2 into object1
$.extend( object1, object2 ); // Assuming JSON.stringify - not available in IE<8
$( "#log" ).append( JSON.stringify( object1 ) );
</script> </body>
</html>

Demo:

{"apple":0,"banana":{"price":200},"cherry":97,"durian":100}

  递归合并2个对象,修改第一个对象

 <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.extend demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body> <div id="log"></div> <script>
var object1 = {
apple: 0,
banana: { weight: 52, price: 100 },
cherry: 97
};
var object2 = {
banana: { price: 200 },
durian: 100
}; // Merge object2 into object1, recursively
$.extend( true, object1, object2 ); // Assuming JSON.stringify - not available in IE<8
$( "#log" ).append( JSON.stringify( object1 ) );
</script> </body>
</html>

Demo:

{"apple":0,"banana":{"weight":52,"price":200},"cherry":97,"durian":100}

  合并默认值和设置值,且不修改默认值,这也是常见的插件开发类型。

 <!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.extend demo</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body> <div id="log"></div> <script>
var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" }; // Merge defaults and options, without modifying defaults
var settings = $.extend( {}, defaults, options ); // Assuming JSON.stringify - not available in IE<8
$( "#log" ).append( "<div><b>defaults -- </b>" + JSON.stringify( defaults ) + "</div>" );
$( "#log" ).append( "<div><b>options -- </b>" + JSON.stringify( options ) + "</div>" );
$( "#log" ).append( "<div><b>settings -- </b>" + JSON.stringify( settings ) + "</div>" );
</script> </body>
</html>

Demo:

defaults -- {"validate":false,"limit":5,"name":"foo"}
options -- {"validate":true,"name":"bar"}
settings -- {"validate":true,"limit":5,"name":"bar"}

  

大虾翻译(一):jQuery.extend()的更多相关文章

  1. 图片放大功能插件及jquery.extend函数理解

    前端时间,产品提出社区评论中的图片需要有放大功能.感觉可以共用,所以就想整合一个插件,过程中也借鉴了一些例子. 分析下自己的代码思路: var scaleImg = function(opts) { ...

  2. jQuery为开发插件提拱了两个方法:jQuery.fn.extend(); jQuery.extend();

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(); jQuery.extend(); jQuery.fn jQuery.fn = jQuery.prototype ...

  3. jquery.extend

    经常在插件中看到jquery.extend 方法,最近在尝试写一些简单的插件,顺便研究一下这个方法. 原文:http://www.cnblogs.com/RascallySnake/archive/2 ...

  4. jQuery extend扩展String原型

    jQuery.extend(String.prototype, { isPositiveInteger:function(){ return (new RegExp(/^[1-9]\d*$/).tes ...

  5. jQuery.extend和jQuery.fn.extend的区别【转】

    解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...

  6. jQuery原生框架中的jQuery.fn.extend和jQuery.extend

    extend 方法在 jQuery 中是一个很重要的方法,jQuey 内部用它来扩展静态方法或实例方法,而且我们开发 jQuery 插件开发的时候也会用到它.但是在内部,是存在 jQuery.fn.e ...

  7. jquery.extend方法

    jquery.extend()用来扩展jquery中方法,实现插件. 1.jQuery.extend函数详细用法! 扩展jQuery静态方法. 1$.extend({ 2test:function() ...

  8. jQuery extend方法使用及实现

    一.jQuery extend方法介绍 jQuery的API手册中,extend方法挂载在jQuery和jQuery.fn两个不同对象上方法,但在jQuery内部代码实现的是相同的,只是功能却不太一样 ...

  9. jQuery.extend()方法和jQuery.fn.extend()方法源码分析

    这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例,对于基本用法举几个例子: html代码如下: <!doctype html> ...

随机推荐

  1. 无法解析该名称 outlook必须处于联机,控制面板删除账户

    无法解析该名称 outlook必须处于联机,控制面板删除账户

  2. Web测试基于实际测试的功能测试点总结--转载

    文章来源:http://www.51testing.com/html/99/n-854599.html 好文章就该记录一下\(^o^)/~ 一.页面链接检查:测试每一个链接是否都有对应的页面,并且页面 ...

  3. substance的使用示例(转)

    可以使用substance改变界面的皮肤和主题,让Java制作的界面“炫”起来 . 可以下载substance.jar文件 在代码中你可以用: static { try { try { UIManag ...

  4. Qt数据类型转换

    把QString转换为double类型 方法1.QString str="123.45"; double val=str.toDouble(); //val=123.45 方法2. ...

  5. IAR FOR ARM 各版本号,须要的大家能够收藏了

    首先感谢大家的支持与关注,如今应该又一次编辑这篇文章了,这篇文章是非常久曾经不知在什么地方Copy过来的, 非常多问题不知怎么解决,如今我用的是KEIL for arm. 用过Keil和IAR,个人感 ...

  6. Moran’s I空间统计中出现内存溢出的问题

    在经济学.资源管理.生物地理学.政治地理学和人口统计等领域,经常会有如下的研究需求: 研究区域中的富裕区和贫困区之间的最清晰边界在哪里? 研究区域中存在可以找到异常消费模式的位置吗? 研究区域中意想不 ...

  7. java打印各种菱形

    /** * 类说明 * * @author 曾修建 * @version 创建时间:2014-7-23 上午09:50:46 */ public class Diamond { public stat ...

  8. CSDN挑战编程——《金色十月线上编程比赛第二题:解密》

    金色十月线上编程比赛第二题:解密 题目详情: 小强是一名学生, 同一时候他也是一个黑客. 考试结束后不久.他吃惊的发现自己的高等数学科目竟然挂了,于是他果断入侵了学校教务部站点. 在入侵的过程中.他发 ...

  9. 【牛刀小试2】password保

    ]password保 主要知识: 1.        while循环 2.        do-while循环 3.        if-else 4.        strcmp()函数 [充电一下 ...

  10. JSP简单的练习-用户登记表

    <%@ page language="java" import="java.util.*" pageEncoding="gb2312" ...