我在插件中看到了这个:
var options = $.extend(defaults, options);
它是如何运作的?
extend()
做了什么?
答案 0 :(得分:162)
文档在解释扩展如何工作方面并不准确,所以我进行了一些测试:
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
如果只将一个对象传递给jQuery.extend()
,则jQuery假定jQuery
对象本身是“第一个”参数(即:要修改的对象) ,你的对象是“第二个”(即:添加到第一个的对象)。所以:
console.log( "Before: " + jQuery.foo );
jQuery.extend({foo:1});
console.log( "After: " + jQuery.foo );
结果:
Before: undefined
After: 1
答案 1 :(得分:20)
将一个对象的内容合并到另一个。如果我们传递两个对象,第二个对象属性将添加到第一个对象/第一个参数
Ex: $.extend(object1, object2);
现在 object1包含object2的属性
如果我们想合并两个对象,那么我们需要在第一个参数中传递空对象
Ex: var newObject = $.extend({}, object1, object2);
现在 newObject包含object1和object2的属性。
答案 2 :(得分:10)
来自jQuery文档
合并两个或更多内容 对象一起进入第一个 对象
在插件上下文中:如果用户没有为该函数设置可选参数,则会使用默认值。
答案 3 :(得分:3)
extend()在jQuery中如何工作?的 [解决] 强>
jQuery有深拷贝和轻量级拷贝。第一个布尔值决定它,对于光线为真,对于光线为真。
例如:
jQuery.extend(false,{'a':{'a1':1}},{'a':{'a2':2}})
结果将是: {'a':{'a2':2}}因为这是轻量级副本,只需比较级别1.
jQuery.extend(true,{'a':{'a1':1}},{'a':{'a2':2}})
结果将是: {'a':{'a1':1,'a2':2}}这是具有多级对象的深层复制(就像数组级别一样)
jQuery.extend(a,b,c),a,b,c是对象或数组。流重写将是b-> a,c - > a(b覆盖a,c覆盖a ...)此函数也将返回a和a也更改值。
高级示例:
jQuery.extend({'number_param':1})
如果您只是通过一个参数。 jQuery将扩展自己。 console.log(jQuery ['number_param'])将输出1。
jQuery.extend(1,{'number_param':'2'});这个例子不附加jQuery本身。第一个参数必须是布尔值。在这种情况下,它将返回{'number_param':'2'}并且jQuery不会更新。
jQuery.extend(a,b,c,d,e,f);订单合并将是。 b - > a, c - > a,d - > a,e - > a,f - > a(b覆盖a,c覆盖...)。结果返回将是一个。
a = {'p':1}。 jQuery.extend(a,{'p':2},{'p':3},{'p':4},{'p':5})将返回a和a = {'p': 6}。传递给此函数的数字参数是无限的。
答案 4 :(得分:1)
jQuery文档中有一个完美的例子:.extend() method
答案 5 :(得分:0)