JavaScript example code for inheritance

Example

The code is as follows

Copy Code

/** * Implementation subclass inherits the parent class, but does not produce redundant properties and methods * @returns {Function} */ Define (function () { return function (subtype, supertype) { var proto = new Object (supertype.prototype); Proto.constructor = subtype; Subtype.prototype = Proto; }; }); —————————————————————————— Define (function () { function ostring (s) { This.str = s; This.length = This.str.length; } Ostring.prototype.show = function () { alert (THIS.STR); }; return ostring; }); —————————————————————————— define ([' Inherit ', ' ostring '], function (Inherit, ostring) { function wstring (s) { Invoking the parent class constructor with the call implementation Ostring.call (this, s); This.chlength = 2 * s.length; } Inheritance of other properties Inherit (wstring, ostring); Wstring.prototype.add = function (W) { Alert (This.str + W); }; return wstring; }); ——————————————————————————

Look at the example again

One, use function to achieve:

The code is as follows	Copy Code
function person (name) { THIS.name = name; } Person.prototype.getName = function () { return this.name; } function Author (name, books) { This.inherit=person; This.inherit (name); This.books = books; } var au=new Author ("Dororo", "Learn much"); Au.name

Or the same effect:

The code is as follows	Copy Code
function person (name) { THIS.name = name; } Person.prototype.getName = function () { return this.name; } function Author (name, books) { Person.call (this, name); This.books = books; } var au=new Author ("Dororo", "Learn much"); Au.getname

Since this is just a parameter that invokes the constructor of the parent class person, assigns all the fields that are assigned to the parent class to the author subclass, so that the domain (prototype prototype) that is defined outside of any parent class person constructor is not inherited. So in the above example, Au.getname will be undefined (undefined), because getname is defined in the prototype object of person.

Also, the constructor of a subclass calls the parent class constructor before defining its own domain, lest the subclass's definition be overwritten by the parent class. That is, the author Definition property book will be overwritten by the property in person after Person.call. At the same time, it is also best not to use prototype to define the function fields of subclasses, because after a subclass is instantiated, the prototype is executed and then the constructor of the parent class is invoked, which is also easily overwritten by the attributes of the parent class.

Second, with prototype to achieve:

code is as follows

copy code

function Person (name) {     this.name = name; } Person.prototype.getName = function () {     return this.name; } Function Author (name, books) {     this.books = books;  } Author.prototype=new Perso n (name); Author.prototype.constructor=author; Author.prototype.getBooks = function () {     return this.books; } var au1=new Author ("Dororo1", "Learn much"); var au2=new Author ("Dororo2", "Learn less"); Alert (Au1.getname ()); Alert (Au2.getname ());

This method avoids the problem of prototype in the function implementation. Because author.prototype=new person (name), the new person () instance invokes all the properties of the person construct and the stereotype. But the disadvantage is that Author.prototype has been instantiated. So when subclasses are instantiated, all of the reference data types are copy. So in the above example, either the instance au1 or the AU2 return value is Dororo1.

Third, the use of "mixed" to achieve

The code is as follows

Copy Code

function person (name) { THIS.name = name; } Person.prototype.getName = function () { return this.name; } function Author (name, books) { This.base = new person (name); for (var key in This.base) { if (!this[key]) { This[key]=this.base[key]; } } This.book=books; } var au1=new Author ("Dororo1", "work"); var au2=new Author ("Dororo2", "play"); Alert (Au1.getname ()); Alert (Au2.getname ()); Au1.book; Au2.book;

is an extension that copies all the fields of the parent class to subclasses. There is no such thing as these two aspects at all.

Parasitic combination mode)

The inheritance of JS includes inheritance of attributes and inheritance of methods, which are implemented by different methods respectively.
1 Inheritance of properties
The inheritance of a property is implemented by changing the execution environment of the function. Changing the execution environment of a function can use both call () and apply ()

method to implement.
We first create a animal "class" (because JS does not have a class concept, here is just a simulation, it is actually just a

Function object).

The code is as follows

Copy Code

function Animal (typeName) { Adds a property to the execution environment for the current method (this) typename But the execution environment (this) can be determined when the function is executed This.typename = TypeName; This.colors = ["Red", "while"]; } To add two (object shared) methods to the prototype of a function Animal.prototype.Shout = function () {alert ("I am:-" + this.typename);}; Animal.prototype.Eat = function () {alert ("I am:-" + this.typename)}; --Define a lion--"class" (which is actually a function) function Lion (TN) { --Executes the animal method and modifies the animal execution environment to lion through the first parameter of apply Similarly, the lion of this, and also in the execution of the time to determine who Animal.apply (this,["lion");//--inherits the variable properties of the parent class, this is new lion,this is lion } Lion.prototype = Animal.prototype; The method of inheriting the parent class, fix-but this is not good, when the subclass adds a method, the parent class also has this method, which is the pointer reference Lion.prototype.Hunt = function () { Alert ("I am: lion, I am going to hunt ~~ ~"); } var aminm = new Animal (); Aminm. Hunt (); ---can access the method of the subclass, which is not good. ----So how to solve this problem?????? ---Solution: The inheritance method can be written like this: Lion.prototype = new Animal ()//The method that inherits the parent class, assigns the Animal object to the prototype prototype, in fact it also has attributes var lion = new Lion (); In addition to creating, the New keyword modifies the execution environment of the Lion object as the Lion object itself ---in other words, when the new is over, this is the lion function itself in the lion function, and then call the Lion function

To analyze the New keyword:

And the New keyword is great, in the previous code, the new keyword completes the following tasks:

1) open up heap space to prepare storage lion objects
2) Modify the execution environment of the Lion object itself so that this point of the lion function points to the Lion function object itself.
3 invokes the constructor of the lion "class" to create the Lion object
4 Assign the heap address of the Lion function object to the variable L, this time L point to the Lion function object

Lion. Shout ();
Lion. Eat ();
---but this inheritance has a disadvantage: the constructor of the parent class is called two times, call once, and then new again