0

我有一个jQuery 图片库插件，最近的一个拉取请求让我怀疑我是否extend()正确使用。

我目前使用的格式：

$.fn.collagePlus = function( options ) {

    // Defaults
    var settings = $.extend( {
        "someDefault" : true
        ...
    }, options);

但是阅读文档，看来我应该这样做：

var settings = $.extend( {}, $.fn.collagePlus.defaults, options );

虽然我有一些动态的默认值所以我可能应该这样做：

var defaults = { "someDefault" : true };
var settings = $.extend( {}, defaults, options );

我应该使用什么方法？

4

2 回答 2

2

扩展方法可以描述如下：

$.extend(target, more1, more2, moreN);

wheretarget将是使用该more1...N顺序中的所有属性扩展的对象：

var target = {};
var more1 = {a: 1, b: 2};
var more2 = {b: -2, c: -3};

$.extend(target, more1, more2);

console.log(target); // {a: 1, b: -2, c: -3}

如您所见，目标对象将首先从 more1 接收属性，然后从 more2 接收属性。

至于您的情况，您可以使用所有这三种方法，但我建议您使用第二种方法，因为它使您可以覆盖默认值，因为它们可以使用：（$.fn.plugin.defaults）从全局范围访问。

$.fn.plugin.defaults

然后插件的用户可以在他正在使用的内容中为插件设置默认值：

$.fn.plugin.defaults.something = false;

并且没有使用该信息多次初始化插件：

// Top of file, config file or so:
$.fn.plugin.defaults.something = false;

// Somewhere else
$(a).plugin();
$(b).plugin();

// If this pattern is not used you will have to do:
$(a).plugin({something: false});
$(b).plugin({something: false});

$.extend(true, target, more);

一个侧面节点是，如果将 iftrue作为第一个参数传递给$.extendjQuery，将使得深度克隆比浅克隆更重要：

var target = { a: { a: 1 } };
var more = { a: { b: 2 } };

$.extend(target, more); 
console.log(target) { a: { b: 2 } }


var target = { a: { a: 1 } };
var more = { a: { b: 2 } };
//         V--- Note true here
$.extend(true, target, more); 
console.log(target) { a: { a: 1, b: 2 } }

静态与动态默认值：

$.fn.plugin = function() {
    return this.each(function() {
         var options = $.extend({}, $.fn.plugin.defaults, {
             images: $(this).children()
         }, arguments[0]);
    });
};

$.fn.plugin.defaults = { something: true, text: "Default Text" };
于 2013-08-02T11:25:23.960 回答
1

您的第一次调用没问题，因为选项将被合并到仅在此处创建和使用的第一个对象（默认值）中。仅当您的默认对象在另一个地方声明并在多个调用之间共享时才需要第二种语法，因为合并更改默认对象的危险。

于 2013-08-02T11:22:41.567 回答