Using the JavaScript modular pattern, I'm attempting to override a variable defined in the parent class, via it's children.
I've defined these classes as enclosures.
var parentClass = (function () {
var _tabsPerCall;
var _nextCall;
var _tabsArray;
var loadNext = function () {
var nextCallAmount = _tabsPerCall + _tabsPerCall;
_nextCall = (_tabsArray.length - nextCallAmount) >= 0 ? nextCallAmount : _tabsArray.length;
};
return {
get: function () {
return _tabsArray.slice(0, _nextCall);
},
clicked: function (tabIndex) {
if (tabIndex === _nextCall) {
loadNext();
}
}
};
})();
var child1Class = (function (parentClass) {
var newObj = parentClass;
newObj._tabsPerCall = 6;
newObj._nextCall = 6;
newObj._tabsArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
return newObj;
})(parentClass);
var child2Class = (function (parentClass) {
var newObj = parentClass;
newObj._tabsPerCall = 5;
newObj._nextCall = 5;
newObj._tabsArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
return newObj;
})(parentClass);
When I call childClass.get(), though, I get an error, stating that _tabsArray is undefined.
Both children would need to maintain different values for _tabsPerCall, _nextCall and _tabsArray.
Before, I was attempting to do it this way, but both children were sharing the same instance of parentClass:
var childClass= (function (tabBtnBuilder) {
tabBtnBuilder._tabsPerCall = 6;
tabBtnBuilder._nextCall = 6;
tabBtnBuilder._tabsArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
return tabBtnBuilder;
})(tabBtnBuilder);
Am I not overriding the parentClass properly?
I need both children to inherit from parentClass, but they need to maintain their own instances of the parentClass variables.