jQuery.extend()

使用jquery的$.extend()之前突然想到如何查看jquery的版本

$.fn.jquery

转入正题，在没有研究jquery源码之前，都不知道这个方法的使用，接触过后感觉这东西还可以，在此做个note

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

注意：

1. 如果只为$.extend()指定了一个参数，则意味着参数target被省略。此时，target就是jQuery对象本身。通过这种方式，我们可以为全局对象jQuery添加新的函数。
2. 如果多个对象具有相同的属性，则后者会覆盖前者的属性值。

定义和用法

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

指示是否深度合并

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

deep ：可选。 Boolean类型 指示是否深度合并对象，默认为false。如果该值为true，且多个对象的某个同名属性也都是对象，则该"属性对象"的属性也将进行合并。

target : Object类型 目标对象，其他对象的成员属性将被附加到该对象上。

object1：可选。 Object类型 第一个被合并的对象

objectN：可选。 Object类型 第N个被合并的对象。

1.基本的用法：

1 var option1 = {2 ????max: 100,3 ????min: 204 }5 var option2 = {6 ????flag: true,7 ????disable: false8 }9 var objconfig = $.extend(option1, option2);

objconfig的值为合并后的对象 {max: 100, min: 20, flag: true, disable: false}

这种用法的缺点是什么呢？改变了option1 ！！！

然后我们如果不需要改变option1可以把target设置为{}，目标对象为新的{}，而不是option1，到时option1将不会不改边，把option1和option2合并成一个对象

var option1 = { ???max: 100, ???min: 20}var option2 = { ???flag: true, ???disable: false}var objconfig = $.extend({}, option1, option2);

2.合并的对象之间含有重复的属性

var option1 = { ???max: 100, ???min: 20}var option2 = { ???flag: true, ???disable: false, ???min: 100}var objconfig = $.extend({}, option1, option2);

objconfig的值为{max: 100, min: 100, flag: true, disable: false}

也就是合并对象有重复的属性值时，后面的对象的相同属性值会覆盖前面的。

3.合并的对象含有子对象

var option1 = { ???max: 100, ???min: 20, ???user: { ???????name: ‘tony‘, ???????age: 18 ???}}var option2 = { ???flag: true, ???disable: false, ???min: 100, ???user: { ???????name: ‘anny‘, ???????job: ‘student‘ ???}}var objconfig = $.extend({}, option1, option2);

看如下结果

后面的user覆盖了前面的user

这个时候就涉及到深拷贝了，需要把第一个参数deep设置为true

var objconfig = $.extend(true, {}, option1, option2);

深拷贝对象的子对象的属性也合并拷贝了，但是子对象的属性值依然是后面的覆盖前面的

4.此方法可以给jquery添加新的函数

$.extend( ???{ ???????min: function(a, b) { return a < b ? a : b; }, ???????max: function(a, b) { return a > b ? a : b; } ???})console.log($.min(3,5))console.log($.max(5,3))

当extend的对象只有一个时默认是给jquery扩展的，也就是那个对象的属性被附加到jquery身上。

jQuery.extend()

原文地址：https://www.cnblogs.com/freezyh/p/9313658.html