PDA

View Full Version : How to call private methods within a Mixin?



fdp
18 Feb 2015, 4:01 AM
Hi

I need to use a private method inside a mixin class, but I must be sure that the method will not collide with other methods that can be created by the class that owns my mixin.

This is the code and the fiddle:



Ext.define('MyBase', {
constructor: function (config) {
console.log('2 MyBase constructor');
return this;
}
});


Ext.define('MyMixin1', {
extend: 'Ext.Mixin', // base class for mixins
mixinConfig: {
id: 'mixin1' // allow this.mixins.session from owning class
},
constructor: function (config) {
console.log('3 MyMixin1 constructor');
var me = this;
me.callParent(arguments); // calls parent constructor (use when class has extend property)
me.initialize(); // Mixin initialize
return this; // Class constructor must always return 'this'
},
initialize: function () {
console.log('4 MyMixin1 initialize');
}
});


Ext.define('MyDerived', {
extend: 'MyBase',
mixins: {
mymixin1: 'MyMixin1'
},
constructor: function (config) {
console.log('1 MyDerived constructor');
var me = this;
me.callParent(arguments); // calls parent constructor (use when class has extend property)
me.mixins.mymixin1.constructor.call(me);
me.initialize(); // MyDerived initialize
return this;
},
initialize: function () {
console.log('5 MyDerived initialize');
}
});


Ext.application({
name : 'Fiddle',
launch : function() {
var d1 = Ext.create('MyDerived');
// Output is
// 1 MyDerived constructor
// 2 MyBase constructor
// 3 MyMixin1 constructor
// 5 MyDerived initialize
// 5 MyDerived initialize
}
});


https://fiddle.sencha.com/#fiddle/ifd

The question is, what is the right way to call private methods inside class mixin?
Also please fix my code if it can be improved in any way.

Thanks.

fdp
19 Feb 2015, 8:41 AM
The output that I expect is

// 1 MyDerived constructor
// 2 MyBase constructor
// 3 MyMixin1 constructor
// 4 MyMixin1 initialize
// 5 MyDerived initialize

instead of another 5

LesJ
19 Feb 2015, 12:28 PM
See the Ext.mixin.Observable which uses a closure to store private members, in this case a private destroyable class. Whatever you put in the closure is guaranteed not to cause any collisions.

Ext.define('Ext.mixin.Observable', function(Observable) {


var emptyFn = Ext.emptyFn,
emptyArray = [],
arrayProto = Array.prototype,
arraySlice = arrayProto.slice,
// Private Destroyable class which removes listeners
ListenerRemover = function(observable) {


// Passed a ListenerRemover: return it
if (observable instanceof ListenerRemover) {
return observable;
}


this.observable = observable;


// Called when addManagedListener is used with the event source as the second arg:
// (owner, eventSource, args...)
if (arguments[1].isObservable) {
this.managedListeners = true;
}
this.args = arraySlice.call(arguments, 1);
};


ListenerRemover.prototype.destroy = function() {
this.destroy = Ext.emptyFn;
var observable = this.observable;
observable[this.managedListeners ? 'mun' : 'un'].apply(observable, this.args);
};


return {
extend: 'Ext.Mixin',
mixinConfig: {
id: 'observable',
after: {
destroy: 'clearListeners'
}
},


requires: [
'Ext.util.Event'
],


mixins: ['Ext.mixin.Identifiable'],


...
});
});