extend（）函数在jQuery中是如何工作的？

我在一个插件中看到了这一点：

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

它是如何工作的

---

做什么？

来自jQuery文档

合并两个或多个文件的内容 对象一起放入第一个 反对

在插件上下文中：如果用户没有为函数设置可选参数，则将使用默认值。

它正是这样做的

说明：将两个或多个对象的内容合并到 第一个目标

更多信息请参见

多个参数 文档没有精确地解释extend的工作原理，因此我运行了一个小测试：

var a = {foo: 1, bar: 1};
var b = {foo: 2, baz: 2};
var c = {foo: 3};
var r = jQuery.extend(a,b,c);
console.log("A: Foo=" + a.foo + " Bar=" + a.bar + " Baz=" + a.baz);
console.log("B: Foo=" + b.foo + " Bar=" + b.bar + " Baz=" + b.baz);
console.log("C: Foo=" + c.foo + " Bar=" + c.bar + " Baz=" + c.baz);
console.log("R: Foo=" + r.foo + " Bar=" + r.bar + " Baz=" + r.baz);
console.log("A === R?: " + (a === r));

（console.log函数用于Firebug；如果愿意，可以用alert（）或其他输出函数替换它）

结果是：

A: Foo=3 Bar=1 Baz=2
B: Foo=2 Bar=undefined Baz=2
C: Foo=3 Bar=undefined Baz=undefined
R: Foo=3 Bar=1 Baz=2
A === R?: true

由此我们可以看到jQuery.extend（）

• 从第一个参数提供的对象开始
• 在第二个参数中添加任何属性。如果第一个参数中已存在该属性，则会覆盖该属性。第二个参数的对象不变
• 使用任何后续参数重复上述操作
• 返回第一个参数

这对于将用户和默认选项对象组合在一起以获得完整的选项集非常有用：

function foo(userOptions) {
  var defaultOptions = {
    foo: 2,
    bar: 2
  };
  var someOtherDefaultOptions = {
    baz: 3
  };

  var allOptions = jQuery.extend(
    defaultOptions,
    someOtherDefaultOptions,
    userOptions
  );
  doSomething(allOptions);
}

foo({foo:1, baz:1});

请注意，“null”是覆盖的有效值，但“undefined”不是。你也许可以利用这个

var a = {foo: "a", bar: "a"};
var b = {foo: null, bar: undefined};
jQuery.extend(a,b);
console.log("A: Foo=" + a.foo + " Bar=" + a.bar);

结果：

A: Foo=null Bar=a

Before: undefined
After: 1

单参数 如果只将一个对象传递给

jQuery.extend（）

，那么jQuery假定

jQuery

对象本身是“第一个”参数（即：要修改的参数），而您的对象是“第二个”（即：要添加到第一个参数的对象）。因此：

结果：

A: Foo=null Bar=a

Before: undefined
After: 1

---

它将一个对象的内容合并到另一个对象中。如果我们传递两个对象，第二个对象属性将添加到第一个对象/第一个参数

Ex: $.extend(object1, object2);

现在，object1包含object2的属性

如果我们想要合并两个对象，那么我们需要在第一个参数中传递空对象

Ex: var newObject = $.extend({}, object1, object2);

---

现在新对象同时包含object1和object2的属性

目的是扩展现有对象。例如，如果我们有一个模板对象，并且希望通过添加更多属性或覆盖现有属性来扩展该对象，那么jquery extend可能会很有用

var carObjectTemplate = {
"make": "honda",
"model":"city",
"mileage":"20",
"variant":"petrol"

})

现在如果我们想扩展它，

$.extend（true，{“color”：“red”}，carObjectTemplate，{“model”：“amaze”}）
它将为我们提供输出，扩展carObjectTemplate并添加

{"color":"red"} property and overriding "model" property from "city" to "amaze"

第一个布尔参数true/false用于指示我们是否需要深度或浅层副本
extend（）在jQuery中如何工作[已解决]

jQuery有深度拷贝和轻度拷贝。第一个布尔值决定它，对深为真，对光为假

例如：


extend（false，{'a'：{'a1'：1}}，{'a'：{'a2'：2}）

结果将是：
{'a'：{'a2'：2}}因为这是轻拷贝，所以只需比较级别1


extend（true，{'a'：{'a1'：1}}，{'a'：{'a2'：2}）

结果将是：
{'a'：{'a1'：1，'a2'：2}这是具有多个对象级别的深度复制（与数组级别类似）


用a，b，c表示对象或数组扩展（a，b，c）。流量超调将为b->a，c->a（b超调a，c超调a…），此函数将返回a，也会更改值


高级示例：


extend（{'number_param'：1}）

如果你只是通过了一个参数。jQuery将扩展自身。log（jQuery['number\u param']）将输出1


extend（1，{'number_param'：'2'}）；这个例子不是附加jQuery本身。第一个参数必须是布尔值。在本例中，它将返回{'number_param'：'2'}，并且jQuery不会得到更新


extend（a，b，c，d，e，f）；订单合并将被取消。b->a，
c->a，d->a，e->a，f->a（b覆盖a，c覆盖a…）。结果返回将是a

使用={'p'：1}。
extend（a，{'p'：2}，{'p'：3}，{'p'：4}，{'p'：5}）将返回a，a={'p'：6}。传递给此函数的参数数量是无限的


如果b.baz是一个对象，说
{zed:'dark'}
而不是
2
，然后设置
r.baz.zed='light'
，那么
b.baz.zed
的值是多少？ie是通过引用复制还是合并属性？回答我自己的问题，
b.baz.zed
将是
light
-ie值通过引用合并。看到精彩的解释，+1我希望官方文件应该像这样清晰+1$.extend（true、object1、object2）；和$.extend（object1，object2）；不同之处……您可以在jQuery文档中阅读，但我想这是一个更好的解释。jQuery有很好的文档。只需在Search jQuery字段中键入方法名称。我想Todd想知道jQuery.extend是如何工作的，而不是如何使用它。例如，它是通过循环每个属性来创建一个全新的对象，还是以某种令人敬畏的方式使用原型继承单行答案和文档链接作为答案没有多大用处，应该放在评论中。这个答案应该放在评论中。谢谢JOBG！！什么是深度复制还是浅复制？