Rumah >hujung hadapan web >tutorial js >javascript继承的实现方式(代码)
本篇文章给大家带来的内容是关于javascript继承的实现方式(代码),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
JS中继承方式的实现有多种方法,下面是比较推荐的方法,其它继承方式可做了解:
function object(o) { function F() {} F.prototype = o; return new F(); } function inheritPrototype(subType, superType) { var newObj = object(superType.prototype); newObj.constructor = subType; subType.prototype = newObj; } function People() { this.cls = 'people'; } People.prototype.say = function(name) { name = name || this.cls; console.log('My class is '+ name); } function Student() { People.call(this); this.type = 'student'; } inheritPrototype(Student, People); Student.prototype.goToSchool = function() { console.log('I go to school every day.'); } // 测试 var stu = new Student(); console.log('class: ' + stu.cls); // class: people console.log('type: ' + stu.type); // type: student stu.say(); // My class is people stu.goToSchool (); // I go to school every day.
其实,javascript 已经提供了更简单的实现方法,没必要在这造轮子,而且方法不完善,MDN 例子:
// Shape - 父类(superclass) function Shape() { this.x = 0; this.y = 0; } // 父类的方法 Shape.prototype.move = function(x, y) { this.x += x; this.y += y; console.info('Shape moved.'); }; // Rectangle - 子类(subclass) function Rectangle() { Shape.call(this); // call super constructor. } // 子类续承父类 Rectangle.prototype = Object.create(Shape.prototype); Rectangle.prototype.constructor = Rectangle; var rect = new Rectangle(); console.log('Is rect an instance of Rectangle?', rect instanceof Rectangle); // true console.log('Is rect an instance of Shape?', rect instanceof Shape); // true rect.move(1, 1); // Outputs, 'Shape moved.'
如果你希望能继承到多个对象,则可以使用混入的方式:
function MyClass() { SuperClass.call(this); OtherSuperClass.call(this); } // 继承一个类 MyClass.prototype = Object.create(SuperClass.prototype); // 混合其它 Object.assign(MyClass.prototype, OtherSuperClass.prototype); // 重新指定constructor MyClass.prototype.constructor = MyClass; MyClass.prototype.myMethod = function() { // do a thing };
相关文章推荐:
Atas ialah kandungan terperinci javascript继承的实现方式(代码). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!