JavaScript programming for OOP

1. First the single inheritance of JS is realized by a function. To implement inheritance using a prototype approach

1(function () {2 3 $.extend ({4 OOP: {5Extendfunction(Child, father) {6                 if(father = =NULL) {7                     varFather =function () { };8Console.log ( This);9Father.prototype = ThisTen                 } OneChild.prototype =Newfather (); A  -Child.base =father; -Child.prototype.base =Child.prototype; the             } -         } -  -     }); +Window.oop =$.opp; -})();

View Code

This method appends the base instance property and the static instance property to the subclass to find the parent class.

2. Create a base class.

1(function () {2Oop.ui =function () {3         /**4 * Before rendering5 * The base class does not turn on rendering. 6         */7          This. renderbefor =function(self) {8             return false;9         }Ten         /* One * Render function A         */ -          This. Render =function () { -             if( This. renderbefor () = =false)return; the             if( This. Element) { -                  This. Element.wrap ("<span class= ' oop_ui ' ></span>"); -             } -              This. redered (); +         } -          This. redered =function(self) { +  A         } at     } - oop.extend (oop.ui); -})();

View Code

3. Create a subclass.

1(function () {2Oop.ui.select =function($input) {3 4          This. Element =$input5 6          This. renderbefor =function () {7             return true;8         }9          This. Render =function () {Ten             /** One * Use the Apply method to invoke the base class's Render method.  A             */ -              This. base.render.apply ( This, arguments); -              This. Element.parent (). addclass ("Oop-ui-select"); the         } -     }; - oop.extend (Oop.ui.select, oop.ui); -  +})();

View Code

Subclass Oop.ui.select in the Render method.

The method of calling the base class is this.base.render.apply (This,arguments);

Apply is to overwrite this in the Base.render () method as this of the current subclass (that is, point to oop.ui.select).

JavaScript programming for OOP