Зачем использовать Ext.apply в initComponent

Во многих примерах кода используется Ext.apply при настройке свойств компонента в методе initComponent.

Пример:

    initComponent: function(){
        Ext.apply(this, {
            items: {
                xtype: 'button'
            }
    })},

Мой вопрос в том, в чем разница в том, чтобы сделать это таким образом, по сравнению с тем, чтобы сделать это следующим образом:

    initComponent: function(){
        this.items = {
            xtype: 'button'
        }
    }

Для меня это кажется более читаемым. Но я пропускаю что-то, что я получаю от Ext.apply?

Ответ 1

Ext.apply() используется для упрощения копирования многих свойств из источника в целевой объект (большую часть времени исходный и целевой объекты имеют разные наборы свойств), и он может быть дополнительно использован для применения значений по умолчанию ( третий аргумент).

Обратите внимание, что он не сделает глубокие клоны! Значение, если у вас есть массив или объект как значение свойства, он применит ссылку!

Существует также applyIf(), который копирует только те свойства, которые еще не существуют в целевом объекте. В некоторых случаях обе реализации также позволяют отказаться от ссылки на скопированный объект.

Примечание: Второй способ не будет работать, потому что вам не хватает this.

Ответ 2

initComponent: function(){
    items = {
        xtype: 'button'
    }
}

ничего не инициализирует, вы имеете в виду

initComponent: function(){
    this.items = {
        xtype: 'button'
    }
}

который делает то же, что и ваш пример, используя Ext.apply. Но Ext.apply показывает свою мощность в более сложных случаях, например.

var x = {a: 1, c:3, e:5};
Ext.apply(x, {b:2, d:4, f:6});

console.log(x); // Object {a: 1, b: 2, c: 3, d: 4, e: 5, f: 6}

Это часто используется для перезаписывания параметров по умолчанию для компонентов с заданными параметрами инициализации.