📜 ⬆️ ⬇️

Javascript: "classes" and inheritance

I was always a little hated by the absence of a concept of class as such in Javascript, but with inheritance it is generally rather tough. After reading quite a lot of materials on this topic and having tried several “workarounds” from here , including the slightly trimmed version of ajaxoop.js library provided in the comments, I didn’t find anything suitable and familiar.

However, there was a task that required the implementation of the “usual” inheritance, the additional pleasant side effect of which was the presence of the possibility of multiple inheritance.

So, I propose a solution to this problem that is rather simple in my opinion:
/** *    . *     . * : * function MyClass(arg1, arg2) { * ExtClass.call(this, { * MyParentClass1: [arg1], //   1   * MyParentClass2: [arg2], //   2 * MyParentClass3: [arg1, arg2], //    * ... * }); * * //        * //  * } * *      MyClass      *   MyParentClass1  .. *        ,  MyClass *         *    . *           *    : * this.$super['MyParentClassName'].methodName.call(this, ...args...); *         this.$super */ function ExtClass(supers) { //       //        ( , //   ),      this.$super = this.$super ? this.$super : {}; //        //    this.instanceOf() this.$_parents = this.$_parents ? this.$_parents : []; /** * ,       * @param string className     * @returns boolean TRUE  ,  FALSE */ this.instanceOf = function(className) { return (__inArray(className, this.$_parents) || (this instanceof eval(className))); }; /** *      . *  .     : * this.$super['parenClassName'].method.call(this, ...args...); * @param object that   this  * @param string className   */ function __addSuper(that, className) { var obj = new (eval(className)); that.$super[className] = {}; if (!__inArray(className, that.$_parents)) that.$_parents.push(className); for (i in obj) { if (typeof obj[i] == 'function') { that.$super[className][i] = obj[i]; } } }; /** *          * @param mixed value   * @param array arraySeek   * @returns boolean TRUE  ,  FALSE */ function __inArray(value, arraySeek) { if (arraySeek && arraySeek.length) { for (i in arraySeek) { if (arraySeek[i] == value) return true; } } return false; }; //      for (i in supers) { var className = i; var args = supers[i]; (eval(className)).apply(this, args); __addSuper(this, className); } }; 

For example, create 2 parent classes:
 function Parent1() { ExtClass.call(this); //    this.message = function() { return 'Parent1::message'; } } function Parent2() { ExtClass.call(this); //    this.message = function() { return 'Parent2::message'; } } 

and two classes of child classes, each of which inherits from its parent:
 function Child1() { ExtClass.call(this, { Parent1: null }); this.message = function() { return 'Child1::message'; } } function Child2() { ExtClass.call(this, { Parent2: null }); this.message = function() { return 'Child2::message'; } } 

well and the total class inheriting from child classes:
 function Child12() { ExtClass.call(this, { Child1: null, Child2: null }); this.message = function() { //         var message = this.$super['Parent1'].message.call(this) + "\n"; message += this.$super['Parent2'].message.call(this) + "\n"; message += this.$super['Child1'].message.call(this) + "\n"; message += this.$super['Child2'].message.call(this) + "\n"; //     ) message += 'Child12::message' return message; } } 

create an object of the last class and check that it produces the message () method of this object:
 var childTest = new Child12(); alert(childTest.message()); 

And here is the result:
Parent1::message
Parent2::message
Child1::message
Child2::message
Child12::message

As you can see, all parent methods work properly. I hope this solution will be useful to many, good luck!

')

Source: https://habr.com/ru/post/128000/


All Articles