学习JavaScript中的继承类型

吴欣
71 阅读4分钟

在JavaScript中，继承 是一种机制，它允许一个对象继承其父或基对象的所有方法和属性。它也被认为是OOP（面向对象编程）的一个重要组成部分。

在JavaScript中实现继承的想法是增加从现有对象派生的新对象。当新创建的对象成为一个父类的子类或派生对象时，它可以继承其所有的方法和属性。

本篇文章将讨论JavaScript中的继承 类型 。所以，让我们开始吧

JavaScript中的继承类型

JavaScript支持以下类型的继承。

Blank diagram (1)

我们将在下面的章节中讨论上述每一种继承类型。

JavaScript中的原型继承

"原型 继承"使你可以访问父对象的属性和方法。在这种类型的继承中，一个新创建的对象被允许继承一个现有对象的属性和方法。通常，"Object.getPrototypeOf()"和 "Object.setPrototypeOf()"可以用来获取和设置一个对象的原型；然而，ES6标准化了"__proto__"访问器属性，可以用于类似目的。

JavaScript中原型继承的语法

ChildObject.__proto__ = ParentObject

这里 "ChildObject"代表新创建的对象，它继承了 "ParentObject"的属性和方法。

例子。如何实现JavaScript中的原型继承

首先，我们将创建两个名为 "Bike"和 "Venom"的对象，为 "Bike"对象添加一个 "color"属性，为 "Venom"对象添加一个 "name"属性。

let Bike= {

color: "Blue",

};

let Venom = {

name: "Venom",

};

通过使用 "Venom"对象的"__proto__"属性，我们将继承 "Bike"对象的属性。

Venom.__proto__ = Bike;

最后，我们将显示 "Venom "对象的 "自有"（Venom.name）和 "继承"（Venom.color）属性值。

console.log("This is a " + Venom.color + " " + Venom.name);

JavaScript中的伪经典继承

实现 "伪类 继承 " 的想法是创建一个 "继承"函数，协助子类与父类的关联。

为此，"伪类继承 "利用了。

  • 一个 "构造器（）"函数
  • 用于创建实例的 "new"操作符
  • 一个建立继承链的 "原型"属性，它被分配给构造函数，这样所有的实例都会继承指定的属性。

现在，请看下面的例子来清楚地了解伪经典继承。

例子。如何在JavaScript中实现伪类继承

我们将定义一个名为 "Bike()"的构造函数。

function Bike(){

this.name = 'Bike';

}

接下来，我们将创建一个 "info()"函数，它将被 "Bike"的子对象所继承。

Bike.prototype.info= function(){

console.log('This is a ' + this.name );

};

在我们的程序中，我们将声明另一个名为 "Venom"的对象，并利用 "Bike.call()"方法来调用Bike构造函数()。

function Venom() {

Bike.call(this);

this.name = 'Venom';

}

然后，我们将使用 "prototype"属性来实现 "Venom"对象和 "Bike"对象之间的伪经典继承。

Venom.prototype = Object.create(Bike.prototype);

Venom.prototype.constructor = Bike;

在最后一步，"new"操作符被用来创建两个实例，"venom"和 "bike"。

var venom= new Venom();

var bike= new Bike();

这样做之后，"info"()函数被调用到两个实例中。

venom.info();

bike.info();

正如你从下面给出的输出中看到的，伪经典继承已经实现，实例 "venom"成功地继承并执行了 "info()"函数。

JavaScript中的功能继承

通过对一个对象实例应用增强函数（具有通用功能的函数）来继承属性的机制被称为 "功能继承"。定义的增强函数采用动态的对象扩展来为对象实例添加额外的属性和方法。你也可以使用它的 "封闭范围"来保持一些数据的私有性。

例子:如何在JavaScript中实现功能继承

在这个例子中，我们将创建一个 "Bike"对象，它有一个名为 "x"的内部对象。

function Bike(data) {

var x= {};

x.name = data.name;

return x;

}

然后，我们将创建一个名为 "Venom"的子对象，与 "Bike"类建立继承关系。这个子对象将包括一个增强的函数 "info"，它可以访问 "x"对象的 "name"属性。

function Venom(data) {

var x= Bike(data);

x.info= function () {

return "This is a " + x.name + " Bike";

};

return x;

}

为了实现功能继承，我们将创建 "venom"作为一个子实例，并将 "name"属性的值作为 "data"参数传递。

var venom= Venom({ name: "Venom" });

给定的 "console.log()"方法将从父 "Bike"对象中获取 "x.name"属性的值并打印在控制台。

console.log(venom.info());

输出

以上就是关于JavaScript中的继承类型的全部内容。你可以根据自己的喜好进一步探索它们。

总结

原型 继承（Prototypal Inheritance）、伪类继承（Pseudoclassical Inheritance）和功能 继承（Functional Inheritance）是JavaScript中不同类型 的继承 。原型继承是通过"__proto__"属性来实现的，而在功能继承中，定义了一个增强 函数来访问父类的属性。此外，伪类 继承利用构造函数（）、"新"运算符和原型 属性来嵌入两个对象之间的继承关系。本篇文章讨论了JavaScript中不同类型的继承。

avatar
文章
阅读
粉丝