Зачем передавать пустой объект в метод расширения jQuery?

Question

jQuery имеет очень аккуратный метод extend, который объединяет 2 объекта в один.

На jQuery Plugins authoring page они показывают пример следующим образом:

var settings = $.extend({ 
    'location'   : 'top', 
    'background-color' : 'blue' 
}, options); 

Однако, я видел много плагинов передать пустой объект в качестве первого параметра, например, так:

var settings = $.extend({}, { 
    'location'   : 'top', 
    'background-color' : 'blue' 
}, options); 

Что касается как я могу судить, эти двое делают то же самое. Единственное различие было бы, если бы defaults хранились в своей собственной переменной:

var defaults = { 
    'location'   : 'top', 
    'background-color' : 'blue' 
}, 
settings = $.extend({}, defaults, options); 

Таким образом, вы всегда можете получить доступ к по умолчанию без них быть переопределены options.

---

Вот вопрос: Почему так много плагинов авторы решили передать пустой объект extend, даже если они не хранят значения по умолчанию в переменной?

Я что-то упустил?

Answer 1

Возможные причины (для второго примера) ...

• Наследуется невежество ...(видел, что это сделано таким образом, и скопировал практику)

• взрывобезопасности невежество ... (видел это сделано должным образом, как в последнем блоке кода, но заменил кэшированные объект с объектом на лету и не знал, что пустой объект должен быть удален)

• Глобальное потепление.

• Недостаток внимания к деталям ... (аналогично точке 2, знает, что это не нужно, но никогда не нашел время, чтобы изучить код)

• Глобальное охлаждение.

• Чрезмерно оборонительное кодирование ... (боится, что по умолчанию может быть когда-нибудь переработано многократно используемым объектом, и боятся, что пустой объект не будет вставлен в то время)

• разработчиков JQuery всегда делайте то, что им говорят голоса ;-)

В целом, вы правы. Средний объект создается, копируется в пустой объект, затем отбрасывается. Это ненужная и расточительная практика.

Answer 2

Расширение - очень полезная функция для копирования объектов.

Для примера рассмотрим следующее:

foo = {'foo':'a'} 
f = foo 
f.foo = 'hello' 
console.log(f) 
    Object {foo="hello"} 
console.log(foo) 
    Object {foo="hello"} 

f = $.extend({},foo) 
f.foo = 'hello world' 
console.log(f) 
    Object {foo="hello world"} 
console.log(foo) 
    Object {foo="hello"} 

Так как вы можете видеть $ .extend фактически скопирован объект.

EDIT

Причина, почему первый параметр должен быть пустой объект из-за того, как extend работ. Вот как JQuery определяет extend:

jQuery.extend(target [, object1] [, objectN]) 
    target An object that will receive the new properties 
      if additional objects are passed in or that will 
      extend the jQuery namespace if it is the sole argument. 
    object1 An object containing additional properties to merge in. 
    objectN Additional objects containing properties to merge in. 

И кроме того, эта фраза важна:

Имейте в виду, что целевой объект (первый аргумент) будет изменен, и также будет возвращен из $ .extend().

Таким образом, передавая {} в качестве первого параметра, этот пустой объект расширяется, а затем возвращается.

Возврат к вашему примеру settings = $.extend({}, defaults, options);. Если вы измените его на settings = $.extend(defaults, options);, настройки будут одинаковыми, но здесь будут также изменены значения по умолчанию. Вот почему вам нужно, чтобы первый аргумент был {}.

Answer 3

Другой способ положить, что Мики сказал:

var defaults = { 
    one: 'foo', 
    two: 'bar' 
}; 

var options = { 
    two: 'apples', 
    three: 'bananas' 
}; 

// The safe way to extend 
var settings = $.extend({}, defaults, options); 

console.log(settings); // {one: 'foo', two: 'apples', three: 'bananas'} 
console.log(defaults); // {one: 'foo', two: 'bar'} 
console.log(options); // {two: 'apples', three: 'bananas'} 
console.log(settings === defaults); // false 

// Careless way to extend 
var settings = $.extend(defaults, options); 

console.log(settings); // {one: 'foo', two: 'apples', three: 'bananas'} 
console.log(defaults); // {one: 'foo', two: 'apples', three: 'bananas'} 
console.log(options); // {two: 'apples', three: 'bananas'} 
console.log(settings === defaults); // true