`

$.extend()

阅读更多
// merge two object, modifying the first;
var object1={
apple:0,
banana:{weight:14,price:233},
cherry:97
};
var object2={
banana:{price:333},
cherry:38
};
jquery.extend(object1,object2);
//result:
  object1={apple:0,banana{price:333},cherry:38}
//Example: Merge two objects recursively, modifying the first
  var object1 = {
    apple: 0,
    banana: {weight: 52, price: 100},
    cherry: 97
  };
   var object2 = {
    banana: {price: 200},
    durian: 100
  };
  
  $.extend(true, object1, object2);
//result:
object1 === {apple: 0, banana: {weight: 52, price: 200}, cherry: 97, duria
//Example: Merge defaults and options, //without modifying the defaults. This is a common plugin development pattern.

 //target的参数要传递一个空对象,因为target的值最后要改变 


 var empty = {};

var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = $.extend(empty, defaults, options);
//result: settings == { validate: true, limit: 5, name: "bar"     empty == { validate: true, limit: 5, name: "bar"}


 jquery.extend()是编写插件是最常用到的工具函数来处理options;

 下面是fancybox插件的来处理options;


 例如: settings=jquery.extend({},$.fn.fancybox.defaults,settings);


  上面的代码target是个空对象,这样把默认设置defaults作为第一个对象,将用户传入的设置setting合并到defaults上,

  然后将合并后的结果复制给target并将返回值返回。


  下面一个例子: 


  var defaults = { validate: false, limit: 5, name: "foo" };
  var options = { validate: true, name: "bar" };


  var setting=$.extend(defaults,options);


  上面的代码将defaults作为target的参数,最后和setting的值一样但是defaults的值被改变了,而插件的默认值都是固定,所以使用时注意target的参数的用法。


分享到:
评论

相关推荐

    原生js实现jquery $.extend方法

    原生js实现jquery $.extend方法 通过遍历对象属性来实现

    jquery $.fn.extend

    `$.fn.extend`是jQuery库中的一个核心方法,主要用于扩展jQuery对象的方法集合。这个方法允许开发者自定义jQuery的函数,从而实现对DOM元素的操作或添加新的功能。在jQuery中,`$.fn`实际上是`$.prototype`的一个...

    underscore.extend与$.extend实例比较分析

    在JavaScript开发中,`underscore` 和 `jQuery` 都提供了扩展对象的功能,即 `_.extend()` 和 `$.extend()` 方法。这两个方法允许开发者合并一个或多个对象的属性到目标对象中,实现对象间的属性拷贝。本文将深入...

    Jquery实现$.fn.extend和$.extend函数_.docx

    在JavaScript中,jQuery库提供了两种扩展对象的方法,即`$.fn.extend`和`$.extend`。它们都用于增加或修改现有对象的功能,但应用场景不同。本文将深入解析这两种方法的实现原理和用途。 首先,`$.fn.extend`是用于...

    Js-$.extend扩展方法使方法参数更灵活.docx

    在JavaScript开发中,jQuery库提供了一个非常实用的工具函数`$.extend()`,它允许开发者合并两个或更多对象的属性到一个目标对象中。这个方法在处理复杂的数据结构和配置对象时,大大增加了代码的灵活性和可维护性。...

    浅拷贝深拷贝之jQuery中的$.extend分析

    这篇博客“浅拷贝深拷贝之jQuery中的$.extend分析”深入探讨了`$.extend`在浅拷贝和深拷贝场景下的工作原理,这对于理解JavaScript对象的复制机制至关重要。 浅拷贝是指创建一个新对象,然后将源对象的引用属性复制...

    深入理解jquery的$.extend()、$.fn和$.fn.extend()

    在jQuery中,`$.extend()`、`.fn`(即`jQuery.fn`)和`.fn.extend()`是开发者用于增强其功能和创建插件的关键部分。下面我们将详细探讨这三个概念。 1. `$.extend()` `$.extend()`方法用于合并一个或多个对象的属性...

    jQuery.extend

    $.extend(obj1, obj2); // 结果:{a: 1, b: 3, c: 4} ``` 在这个例子中,`obj2`的属性`b`覆盖了`obj1`的`b`,而`c`则被添加到了`obj1`中。 ### 二、深拷贝与浅拷贝 jQuery.extend还提供了深拷贝和浅拷贝的功能。...

    jQuery中$.extend()用法实例

    在jQuery库中,`$.extend()`是一个非常实用的方法,它用于合并两个或更多对象的属性到一个目标对象中。这个方法允许我们方便地扩展对象,从而实现对象的复用和定制。下面我们将深入探讨`$.extend()`的工作原理、参数...

    Jquery实现$.fn.extend和$.extend函数

    在jQuery库中,`$.fn.extend` 和 `$.extend` 是两个非常重要的功能,它们用于扩展jQuery的功能和对象。这两个函数虽然名字相似,但作用却截然不同。 首先,`$.fn.extend` 是用于扩展jQuery选择器对象的方法。当你...

    jQuery的$.extend 浅拷贝与深拷贝

    jQuery的$.extend方法是一个非常强大的工具,它提供对象合并的功能,这在处理对象属性时尤其有用。它支持浅拷贝和深拷贝两种方式,这是在进行数据复制时必须要明确区分的两种不同操作。 浅拷贝是创建一个新对象,...

    浅谈jQuery中的$.extend方法来扩展JSON对象

    在JavaScript的世界里,jQuery库为开发者提供了许多便捷的API,其中`$.extend`是一个非常实用的方法,用于合并或扩展对象的属性。这篇文章将深入探讨`$.extend`在jQuery中的使用,以及它如何帮助我们处理JSON对象。 ...

    Js-$.extend扩展方法使方法参数更灵活

    在JavaScript开发中,$.extend方法是jQuery库提供的一个扩展功能,它能够将一个或多个对象的内容合并到目标对象中,从而实现对象属性的扩展。这个方法在处理参数时提供了一种非常灵活的方式来设置默认值,并且能够...

    jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析

    主要介绍了jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法,结合实例形式分析了jQuery中$.extend(true,object1, object2);进行深拷贝操作相关实现技巧,需要的朋友可以参考下

    jQuery.extend 函数详解

    var newSrc = $.extend({}, {name: "Tom", age: 21}, {name: "Jerry", sex: "Boy"}); console.log(newSrc); // 输出: {name: "Jerry", age: 21, sex: "Boy"} ``` 在这个例子中,`{}`表示一个新的空对象,它是`...

    jQuery:jQuery.extend函数详解

    var result = $.extend({}, {name: "Tom", age: 21}, {name: "Jerry", sex: "Boy"}); console.log(result); // 输出: {name: "Jerry", age: 21, sex: "Boy"} ``` 这里可以看到,`{name: "Jerry", sex: "Boy"}`中的`...

    jQuery $.extend()用法总结

    jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object);为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object);给jQuery对象添加方法。这...

Global site tag (gtag.js) - Google Analytics