JS继承实现方式

leoperfect 发布于2019-08-23 10:47 / 1898人阅读

摘要：中继承方式的实现有多种方法，下面是比较推荐的方法，其它继承方式可做了解测试其实，已经提供了更简单的实现方法，没必要在这造轮子，而且方法不完善，例子父类父类的方法子类子类续承父类如果你希望能继承到多个对象，则可以使用混入的方式继承一个类混

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
};

GPU云服务器云服务器 js继承的几种方式继承方式 php 类继承方式 python实现继承

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/96680.html

JavaScript继承方式详解

摘要：可以通过构造函数和原型的方式模拟实现类的功能。原型式继承与类式继承类式继承是在子类型构造函数的内部调用超类型的构造函数。寄生式继承这种继承方式是把原型式工厂模式结合起来，目的是为了封装创建的过程。 js继承的概念 js里常用的如下两种继承方式：原型链继承（对象间的继承）类式继承（构造函数间的继承）由于js不像java那样是真正面向对象的语言，js是基于对象的，它没有类的概念。...

Yangyang 2019-08-21 10:23 评论0 收藏0
js原型和继承

摘要：举例说明组合继承组合继承利用原型链借用构造函数的模式解决了原型链继承和类式继承的问题。示例组合式继承是比较常用的一种继承方法，其背后的思路是使用原型链实现对原型属性和方法的继承，而通过借用构造函数来实现对实例属性的继承。对js原型和继承的理解一直处于不懂-懂-不懂-懂-不懂。。。的无限循环之中，本来打算只是简单总结下js继承方式，可看了些网上的资料后，发现又不懂继承了。。。这篇文章只...

Hujiawei 2019-08-21 13:49 评论0 收藏0
JS基础（对象创建，构造函数、原型、实例之间关系，继承方式）

摘要：对象创建的三种方式字面量创建方式系统内置构造函数方式自定义构造函数构造函数原型实例之间的关系实例是由构造函数实例化创建的，每个函数在被创建的时候，都会默认有一个对象。 JS 对象创建的三种方式 //字面量创建方式 var person= ｛　name:jack　｝ //系统内置构造函数方式 var person= new Object(); person.name = jack; ...

PAMPANG 2019-08-26 13:30 评论0 收藏0
面向对象的 JavaScript

摘要：是完全的面向对象语言，它们通过类的形式组织函数和变量，使之不能脱离对象存在。而在基于原型的面向对象方式中，对象则是依靠构造器利用原型构造出来的。 JavaScript 函数式脚本语言特性以及其看似随意的编写风格，导致长期以来人们对这一门语言的误解，即认为 JavaScript 不是一门面向对象的语言，或者只是部分具备一些面向对象的特征。本文将回归面向对象本意，从对语言感悟的角度阐述为什...

novo 2019-08-21 10:49 评论0 收藏0
JS专题之继承

摘要：构造函数所以，就有了畸形的继承方式原型链继承三原型链继承改变构造函数的原型对象继承了属性以上例子中，暴露出原型链继承的两个问题包含引用类型数据的原型属性，会被所有实例共享，基本数据类型则不会。前言众所周知，JavaScript 中，没有 JAVA 等主流语言类的概念，更没有父子类继承的概念，而是通过原型对象和原型链的方式实现继承。于是，我们这一篇讲一讲 JS 中的继承（委托）。 ...

rollback 2019-08-23 15:09 评论0 收藏0
《javascript高级程序设计》继承实现方式

摘要：寄生式继承的思路与寄生构造函数和工厂模式类似，即创建一个仅用于封装继承过程的函数，该函数在内部已某种方式来增强对象，最后再像真的是它做了所有工作一样返回对象。这篇本来应该是作为写JS 面向对象的前奏，只是作为《javascript高级程序设计》继承一章的笔记原型链 code 实现 function SuperType() { this.colors = [red,blu...

cppprimer 2019-08-20 18:28 评论0 收藏0