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

语法

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

指示是否深度合并

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

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

1. jquery.extend(), 将两个或更多对象的内容合并到第一个对象。 

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

例子1：合并两个对象，并修改第一个对象

在默认情况下，通过$.extend()合并操作不是递归的;如果第一个对象的属性本身是一个对象或数组，那么它将完全用第二个对象相同的key重写一个属性。这些值不会被合并。

var obj1={size: "10px",float: "left",border:{width:"2px",style:"dashed",color:"#ddd"}}

var obj2={size: "12px",float: "left",border:{width:"1px",style:"solid"},weight: "bolder"}

$.extend(obj1,obj2)

//结果:obj1的size、border属性被覆盖,而且继承了obj2的weight属性

// obj1= {size: "12px",float: "left",weight: "bolder",border:{width:"1px",style:"solid"}}

例子2：采用递归方式合并两个对象，并修改第一个对象。

        如果将 true 作为该函数的第一个参数，那么会在对象上进行递归的合并。

var obj1={size: "10px",float: "left",border:{width:"2px",style:"dashed",color:"#ddd"}}

var obj2={size: "12px",float: "left",border:{width:"1px",style:"solid"},weight: "bolder"}

$.extend(true,obj1,obj2)

//结果:obj1的size属性被覆盖,而且继承了obj2的weight属性 ,obj1的border属性的对象被修改

// obj1= {size: "12px",float: "left",weight: "bolder",border:{width:"1px",style:"solid",color:"#ddd"}}

例子3：合并 defaults 和 options 对象，并且不修改 defaults 对象

目标对象（第一个参数）将被修改，并且将通过$.extend()返回。然而，如果我们想保留原对象，我们可以通过传递一个空对象作为目标对象,如下例子

var obj1={size: "10px",float: "left",border:{width:"2px",style:"dashed",color:"#ddd"}}

var obj2={size: "12px",float: "left",border:{width:"1px",style:"solid"},weight: "bolder"}

let settings=$.extend({},obj1,obj2)

//结果:obj1、obj2不变 把他们赋值到一个空对象赋值给settings

obj1：{size: "10px",float: "left",border:{width:"2px",style:"dashed",color:"#ddd"}}

obj2：{size: "12px",float: "left",border:{width:"1px",style:"solid"},weight: "bolder"}

settings： {size: "12px",float: "left",weight: "bolder",border:{width:"1px",style:"solid"}}

//递归 也就是深拷贝

let settings=$.extend(true,{},obj1,obj2)

//结果:obj1、obj2不变 把他们赋值到一个空对象赋值给settings

obj1：{size: "10px",float: "left",border:{width:"2px",style:"dashed",color:"#ddd"}}

obj2：{size: "12px",float: "left",border:{width:"1px",style:"solid"},weight: "bolder"}

settings： {size: "12px",float: "left",weight: "bolder",border:{width:"1px",style:"solid",color:"#ddd"}}

 

精彩链接

评论可见，请评论后查看内容，谢谢！！！
 您阅读本篇文章共花了：