Simple JavaScript inheritance--a minimalist JS inheritance library

Object oriented

Several important features of object-oriented thinking (requirements for classes):

Abstraction-encapsulation, information hiding (internally implemented methods and data hiding, defining open interfaces)

Inheritance-subclasses can use the resources of the parent class, and can customize their own resources, including methods and data

Polymorphic-Overloaded (function with the same name), overwrite (overriding parent-class function on the basis of inheritance)

JS and Object-oriented

JavaScript uses prototype to implement class inheritance, non-classic object-oriented language classes, and the use of different methods, resulting in more difficult to use.

Please refer to the master's "in-depth understanding of JavaScript prototypes and closures series" http://www.cnblogs.com/wangfupeng1988/p/4001284.html

So various libraries provide their own implementation of the class library, for example:

1. jquery Class Create:https://github.com/protonet/jquery-class-create

Use Class.create to create a utility class, the constructor of an instance, with the disadvantage of using the jquery library

<pre>

// properties are directly passed to `create` method  var Person = Class.create({    initialize: function(name) {      this.name = name;    },    say: function(message) {      return this.name + ‘: ‘ + message;    }  });    // when subclassing, specify the class you want to inherit from  var Pirate = Class.create(Person, {    // redefine the speak method    say: function($super, message) {      return $super(message) + ‘, yarr!‘;    }  });    var john = new Pirate(‘Long John‘);  john.say(‘ahoy matey‘);  // -> "Long John: ahoy matey, yarr!"

</pre>

2, Prototypejs:http://prototypejs.org/learn/class-inheritance

As a function of the Prototypejs library, the use is consistent with the jquery class create interface.

This library also provides an elegant interface for Ajax and DOM, eliminating the complexity of client development.

These two libraries either rely on other libraries, or their own library function complex, volume is large, so the need to use alone is not satisfied.

This article describes a library that does not rely on any library, and implements only the class inheritance, a standalone library developed by the Great God: John resig http://ejohn.org/

Simple JavaScript Inheritance

Simple JavaScript Inheritance

This library's official website is

http://ejohn.org/blog/simple-javascript-inheritance/

The goal of the author is simple-easy to understand, reusable-not dependent on other libraries, using examples:

<pre>

2. var person = class.extend ({

4. Init:function (isdancing) {

6. this.dancing = isdancing;

8. },

10. Dance:function () {

12. return this.dancing;

14. }

16. });

20. var Ninja = Person.extend ({

22. Init:function () {

24. This._super (FALSE);

26. },

28. Dance:function () {

30. Call the inherited version of Dance ()

32. return This._super ();

34. },

36. Swingsword:function () {

38. return true;

40. }

42. });

46. var p = new Person (true);

48. P.dance (); = True

52. var n = new Ninja ();

54. N.dance (); = False

56. N.swingsword (); = True

60. Should all is true

62. P instanceof person && p instanceof Class &&

64. n instanceof Ninja && n instanceof person && n instanceof Class

</pre>

Implementation notes:

1. Creating a constructor must be simple, and the constructor provides only the Init initialization method.

2. To create a new class, you must extend an existing class to invoke extend.

3. All inheritance with the only ancestor Class. The new class created must be a subclass of class.

4. A method with the same name that accesses the parent class in the subclass (that is, overwritten) must be provided. A method with the same name as the parent class is called through the This.super child class with the same name.

Implementation Essentials

Implementation code:

<pre>

2. /* Simple JavaScript inheritance

4. * by John Resig http://ejohn.org/

6. * MIT Licensed.

8. */

10. Inspired by Base2 and Prototype

12. (function () {

14. var initializing = false, Fntest =/xyz/.test (function () {xyz;})? /\b_super\b/:/.*/;

18. The base Class implementation (does nothing)

20. This. Class = function () {};

24. Create a new class that inherits from this class

26. Class.extend = function (prop) {

28. var _super = This.prototype;

32. Instantiate a base class (but only create the instance,

34. Don ' t run the Init constructor)

36. initializing = true;

38. var prototype = new This ();

40. initializing = false;

44. Copy the properties over onto the new prototype

46. for (var name in prop) {

48. Check if we ' re overwriting an existing function

50. Prototype[name] = typeof Prop[name] = = "function" &&

52. typeof _super[name] = = "function" && fntest.test (Prop[name])?

54. (function (name, FN) {

56. return function () {

58. var tmp = This._super;

62. Add a new _super () method is the same method

64. But on the Super-class

66. This._super = _super[name];

70. The method is need to being bound temporarily, so we

72. Remove it when we ' re done executing

74. var ret = fn.apply (this, arguments);

76. This._super = tmp;

80. return ret;

82. };

84. }) (name, Prop[name]):

86. Prop[name];

88. }

92. The Dummy class constructor

94. function Class () {

96. All construction is actually do in the Init method

98. if (!initializing && this.init)

100. This.init.apply (this, arguments);

102. }

106. Populate our constructed prototype object

108. Class.prototype = prototype;

112. Enforce the constructor to being what we expect

114. Class.prototype.constructor = Class;

118. And make this class extendable

120. Class.extend = Arguments.callee;

124. return Class;

126. };

128. })();

</pre>

Points:

1. Initialize init in call Xx.extend{init:function () {}}

The Dummy class constructor

function Class () {

All construction is actually do in the Init method

if (!initializing && this.init)

This.init.apply (this, arguments);

}

2. Subclasses access the parent class's function with the same name through This._super, for example:

1. var person = class.extend ({

2. Init:function (isdancing) {

3. this.dancing = isdancing;

4. }

5. });

7. var Ninja = Person.extend ({

8. Init:function () {

9. This._super (FALSE);

10. }

11. });

13. var p = new Person (true);

14. p.dancing; = True

16. var n = new Ninja ();

17. n.dancing; = False

As follows, the son has this function, and the father also has this function of the same name, when the function address is recorded in This._super.

Check if we ' re overwriting an existing function

Prototype[name] = typeof Prop[name] = = "function" &&

typeof _super[name] = = "function" && fntest.test (Prop[name])?

(function (name, FN) {

return function () {

var tmp = This._super;

Add a new _super () method is the same method

But on the Super-class

This._super = _super[name];

The method is need to being bound temporarily, so we

Remove it when we ' re done executing

var ret = fn.apply (this, arguments);

This._super = tmp;

return ret;

};

}) (name, Prop[name]):

Prop[name];

}

Simple JavaScript inheritance--a minimalist JS inheritance library