jQuery.extend() 函数详解

jQuery.extend()函数用于将一个或多个对象的内容合并到目标对象。

该函数可以将一个或多个对象的成员属性和方法复制到指定的对象上。

该函数属于全局jQuery对象。

语法

静态函数jQuery.extend()有以下两种用法：

用法一：jQuery 1.0 新增该用法。

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

用法二：jQuery 1.1.4 新增该用法。

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

用法二是用法一的变体，参数deep用于指示是否深度递归合并。

参数

请根据前面语法部分所定义的参数名称查找对应的参数。

参数描述deep可选/Boolean类型指示是否深度合并对象，默认为false。如果该值为true，且多个对象的某个同名属性也都是对象，则该"属性对象"的属性也将进行合并。targetObject类型目标对象，其他对象的成员属性将被复制到该对象上。object1可选/Object类型第一个被合并的对象。objectN可选/Object类型第N个被合并的对象。

注意事项：

• 该函数复制的对象属性包括方法在内。此外，还会复制对象继承自原型中的属性(JS内置的对象除外)。
• 参数deep的默认值为false，你可以为该参数明确指定true值，但不能明确指定false值。简而言之，第一个参数不能为false值。
• 如果参数为null或undefined，则该参数将被忽略。

• 如果只为$.extend()指定了一个参数，则意味着参数target被省略。此时，target就是jQuery对象本身。通过这种方式，我们可以为全局对象jQuery添加新的函数。

• 如果多个对象具有相同的属性，则后者会覆盖前者的属性值。
  

返回值

jQuery.extend()函数的返回值是Object类型，返回扩展了其他对象的属性后的目标对象(即参数target)。

示例&说明

jQuery.extend()函数的常规用法请参考如下jQuery代码：

//在当前页面内追加换行标签和指定的HTML内容function w( html ){    document.body.innerHTML += "<br/>" + html;}var x = { name:"CodePlayer" };var y = { age: 18 };var z = { site: "www.365mini.com"  };// y和z的属性将被合并复制到对象x上var obj = $.extend( x, y, z );w( obj === x ); // truew( obj.name ); // CodePlayerw( obj.age ); // 18w( obj.site ); // www.365mini.com

运行代码

如果多个被合并对象有相同的属性，则后者会覆盖之前的属性。

var x = { name:"CodePlayer", age: 20 };var y = { age: 18 };var z = { site: "www.365mini.com", age: 21  };var obj = $.extend( x, y, z );// 三个对象都有age属性，以最靠后的对象z为准w( obj.age ); // 21

运行代码

此外，如果多个对象的同名属性都是对象，则合并这些"属性对象"的属性。

var x = { name:"CodePlayer", map:{ a: 1, b: 1 } };var y = { map: { b: 2, c: 2  } };// 后者的map属性直接覆盖前者的map属性var obj = $.extend( x, y );for(var i in obj.map ){    w( i + "=" + obj.map[i] );}w(""); // 换行隔开/* 以下是深度复制 */x = { name:"CodePlayer", map:{ a: 1, b: 1 } };y = { map: { b: 2, c: 2  } };// 两者的map属性都是对象，则合并map对象的属性。obj = $.extend( true, x, y );for(var i in obj.map ){    w( i + "=" + obj.map[i] );}

运行代码

如果只为该函数指定一个参数，则表示省略target参数，target参数默认为jQuery对象本身。

var x = {     sayHi: function(){        alert("这是新增的测试方法");    }};// 只有一个参数，则表示省略target参数，target参数默认为jQuery对象本身var obj = $.extend( x );w( obj === $ ); // trueobj.sayHi(); // 这是新增的测试方法

运行代码