First, we start with the class inheritance. If you have read the previous article, on how to create a class in JS should have already had the answers, then I directly from the example explained. We define a simple class person and instantiate an object.
| The code is as follows |
Copy Code |
function person (name) { THIS.name = name; } Person.prototype.getName = function () { return this.name; } var reader = new Person ("Miracle"); Reader.getname ();//miracle |
Next we add a subclass of person author to see how to inherit the method of the parent class?
| code is as follows |
copy code |
| function Author (name, books) { person.call (this, name); this.books = books; } Author.prototype = new Person (); Author.prototype.constructor = Author; Author.prototype.getBooks = function () { return this.books; } var author = new author ("Miracle He", ["JavaScript Learning"]); Author.getname (); Author.getbooks (); |
Maybe some friends are not very clear on the above code, I focus on a few of the one by one explanations. First created the author constructor, we all know that when you create an object using the new operator, you first create an empty object and call the constructor, and this empty object will be at the very front of the scope chain, where person calls its own constructor and passes the name parameter to the implementation assignment. The next step is Author.prototype = new person (); everyone knows that in JS no matter what object will have prototype this attribute, when the object's method is invoked, first look for the object's class, If there is no search for the class that continues to the class prototype, it will continue to look up along the prototype chain until the method is found. Now that I've given the person a prototype for author, then I'll reset the constructor property to author. As you can see from the above code, although it is a bit difficult to implement inheritance, it is very simple on the invocation of subclasses. Then we'll refactor our code. An extension method was added:
| The code is as follows |
Copy Code |
function extend (subclass, superclass) { var F = function () {}; F.prototype = Superclass.prototype; Subclass.prototype = new F (); Subclass.prototype.constructor = subclass; } function Author (name, books) { Person.call (this, name); This.books = books; } Extend (Author, person); Author.prototype.getBooks = function () { return this.books; } |
It may also be found that in the author constructor There is a person this solidified figure, we quickly generalized it.
| code is as follows |
copy code |
| function Extend (subclass, superclass) { var F = function () {}; f.prototype = Supercla Ss.prototype; subclass.prototype = new F (); subclass.prototype.constructor = subclass; subclass.parent = Superclass.prototype if ( Superclass.prototype.constructor = = Object.prototype.constructor) { Superclass.prototype.constructor = superclass; } } Function Author (name, books) { Author.parent.constructor.call (this, name); this.books = books; } Extend (Author, person); Author.prototype.getBooks = function () { return this.books } |