数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法律研究TypeScript 中的方法覆盖？
**方法覆盖**是指在继承类中编写方法的新定义，同时保持方法名称、参数和返回类型不变。在本教程中，我们将学习 TypeScript 中的方法覆盖。
**继承**是**面向对象编程**的四大支柱之一。**OOPs** 的方法覆盖特性对继承很有帮助。例如，我们可以在父类中定义方法，并在基类中使用相同名称、参数和返回类型重新定义该方法，但使用不同的代码执行，这就是方法覆盖出现的原因。
语法
用户可以按照以下语法学习方法覆盖。
class Vehicle {
// Info method in parent class
info(): void {
console.log("The object is the vehicle.");
}
}
class car extends Vehicle {
// Same info method overriden in base class
info(): void {
console.log("The object is a car.");
}
}
let new_vehicle = new car();
new_vehicle.info();
在上述语法中，用户可以看到我们在父类中定义了 info() 方法。此外，我们在基类中也定义了同名 info 方法。此外，我们创建了基类的对象并调用了 info() 方法，这将调用基类的 info() 方法。
步骤
**步骤 1** - 使用 class 关键字创建车辆类。
**步骤 2** - 在车辆类中定义 info() 方法，该方法打印消息“该对象是一辆车辆”。
**步骤 3** - 创建汽车类，该类扩展车辆类。此外，在汽车类中定义一些变量。
**步骤 4** - 此外，在汽车类中覆盖车辆类的 info() 方法，该方法提供有关汽车的信息，而不是一般车辆的信息。
**步骤 5** - 在汽车类中创建 get_size() 方法。
**步骤 6** - 最后，创建汽车类的对象并通过获取对象作为引用来调用 info() 和 get_size() 方法。
示例 1
在下面的示例中，汽车类由车辆类继承，该类覆盖了车辆类的 info() 方法。
class Vehicle {
info(): void {
console.log("The object is the vehicle.");
}
}
class car extends Vehicle {
name: string = "car";
color: string = "Black";
size: number = 6;
info(): void {
console.log("The object is a " + this.name);
console.log("The color of the car is " + this.color);
}
get_size(): void {
console.log("The length of the car in the feet is " + this.size);
}
}
let new_vehicle = new car();
// Call the info method of the car class
new_vehicle.info();
// call the get_size() method of the car class
new_vehicle.get_size();
编译后，它将生成以下 JavaScript 代码：
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var Vehicle = /** @class */ (function () {
function Vehicle() {
}
Vehicle.prototype.info = function () {
console.log("The object is the vehicle.");
};
return Vehicle;
}());
var car = /** @class */ (function (_super) {
__extends(car, _super);
function car() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.name = "car";
_this.color = "Black";
_this.size = 6;
return _this;
}
car.prototype.info = function () {
console.log("The object is a " + this.name);
console.log("The color of the car is " + this.color);
};
car.prototype.get_size = function () {
console.log("The length of the car in the feet is " + this.size);
};
return car;
}(Vehicle));
var new_vehicle = new car();
// Call the info method of the car class
new_vehicle.info();
// call the get_size() method of the car class
new_vehicle.get_size();
输出
以上代码将产生以下输出：
The object is a car The color of the car is Black The length of the car in the feet is 6
示例 2
在下面的示例中，我们创建了员工类，并通过员工类扩展了男性类。员工类的 about() 方法告诉我们有关一般员工的信息。
男性类的 about 方法通过向 about() 方法添加一些额外信息来覆盖员工类的 about() 方法。此外，我们还使用 super 关键字在男性类的 about() 方法内部调用了员工类的 about() 方法。
// Creating the employee class containing the about method
class Employee {
about(): void {
console.log("Inside the employee class.");
}
}
// Men calss overriding the about method of employee class
class men extends Employee {
gender: string = "Male";
about(): void {
// calling the about method of the employee class
super.about();
console.log("The gender of the Employee is " + this.gender);
}
}
// Invoking the about method of men class
let new_men = new men();
new_men.about();
编译后，它将生成以下 JavaScript 代码：
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
// Creating the employee class containing the about method
var Employee = /** @class */ (function () {
function Employee() {
}
Employee.prototype.about = function () {
console.log("Inside the employee class.");
};
return Employee;
}());
// Men calss overriding the about method of employee class
var men = /** @class */ (function (_super) {
__extends(men, _super);
function men() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.gender = "Male";
return _this;
}
men.prototype.about = function () {
// calling the about method of the employee class
_super.prototype.about.call(this);
console.log("The gender of the Employee is " + this.gender);
};
return men;
}(Employee));
// Invoking the about method of men class
var new_men = new men();
new_men.about();
输出
以上代码将产生以下输出：
Inside the employee class. The gender of the Employee is Male
示例 3
在下面的示例中，我们使用相同的参数和返回类型在乘法类中覆盖了求和类的 operation() 方法。
class sum {
operation(a: number, b: number): number {
return a + b;
}
}
class multiply extends sum {
// Override the operation method by keeping parameters and return type same
operation(a: number, b: number): number {
return a * b;
}
}
let multi = new multiply();
let result = multi.operation(10, 20);
console.log(
"Result after performing calling the operation method is " + result
);
编译后，它将生成以下 JavaScript 代码：
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var sum = /** @class */ (function () {
function sum() {
}
sum.prototype.operation = function (a, b) {
return a + b;
};
return sum;
}());
var multiply = /** @class */ (function (_super) {
__extends(multiply, _super);
function multiply() {
return _super !== null && _super.apply(this, arguments) || this;
}
// Override the operation method by keeping parameters and return type same
multiply.prototype.operation = function (a, b) {
return a * b;
};
return multiply;
}(sum));
var multi = new multiply();
var result = multi.operation(10, 20);
console.log("Result after performing calling the operation method is " + result);
输出
以上代码将产生以下输出：
Result after performing calling the operation method is 200
用户学习了如何在 TypeScript 中覆盖方法。在第一个示例中，用户学习了如何在基类中简单地覆盖父类方法。在第二个示例中，用户学习了如何在覆盖方法时调用超类的方法。在第三个示例中，用户学习了如何覆盖参数化方法。
更新于： 2022-12-19
13K+ 阅读量
广告