首页 > 编程语言 >TypeScript与面向对象编程

TypeScript与面向对象编程

时间:2024-07-21 20:28:32浏览次数:20  
标签:TypeScript name 多态 面向对象编程 泛型 方法 class

引言

TypeScript简介

TypeScript是JavaScript的一个超集,由微软开发,它在JavaScript的基础上添加了类型系统和对ES6+的新特性的支持。TypeScript最终会被编译成纯JavaScript代码,以便在任何支持JavaScript的环境中运行。

面向对象编程(OOP)概念

面向对象编程是一种编程范式,它使用“对象”来设计软件。对象可以包含数据(通常称为属性)和代码(通常称为方法)。

面向对象编程基础

面向对象编程(OOP)是一种编程范式,它使用“对象”来设计软件。对象是类的实例,包含了数据和操作数据的方法。OOP的核心概念包括类、对象、继承、封装和多态。

类(Class)

类是创建对象的蓝图或模板。它定义了对象将拥有的属性(数据)和方法(行为)。类可以看作是创建对象的“工厂”。

对象(Object)

对象是类的实例。每个对象都有自己的属性和方法的副本。对象是实际存在于程序中的实体,可以接收消息、处理数据和发送消息。

继承(Inheritance)

继承是面向对象编程中的一种机制,它允许一个类(子类)继承另一个类(父类)的属性和方法。这有助于代码复用和创建一个层次化的类结构。

封装(Encapsulation)

封装是将数据(属性)和操作数据的代码(方法)绑定在一起的过程,形成一个独立的对象,并对外隐藏对象的实现细节。封装的目的是保护对象内部的状态,只通过公共的接口与外界交互。

多态(Polymorphism)

多态是指允许不同类的对象对同一消息做出响应的能力。在OOP中,多态通常通过继承和接口实现。多态使得代码更加灵活和可扩展。

TypeScript中的类和对象

类的定义和使用

在TypeScript中,类是创建对象的蓝图。类定义了对象的属性和方法。TypeScript类的定义使用class关键字,可以包含属性、构造函数、方法等。

class Person {
  // 类属性
  name: string;
  age: number;

  // 构造函数
  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  // 类方法
  greet() {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}

对象的创建和属性访问

使用new关键字可以创建类的实例,即对象。通过对象,可以访问类的属性和方法。

const person = new Person('Alice', 30);
person.greet(); // 输出: Hello, my name is Alice and I am 30 years old.

类的构造函数和方法

构造函数

构造函数是类的一个特殊方法,它在创建对象时自动调用。构造函数用于初始化对象的属性。

class Rectangle {
  width: number;
  height: number;

  constructor(width: number, height: number) {
    this.width = width;
    this.height = height;
  }
}
方法

类的方法定义了对象可以执行的操作。方法可以访问类的属性和执行逻辑。

class Circle {
  radius: number;

  constructor(radius: number) {
    this.radius = radius;
  }

  // 计算圆的面积
  calculateArea(): number {
    return Math.PI * this.radius * this.radius;
  }
}

类的访问修饰符

TypeScript支持访问修饰符,用于控制类成员的可见性:

  • public(默认):成员可以在任何地方被访问。
  • private:成员只能在类的内部被访问。
  • protected:成员可以在类及其子类中被访问。
class Vehicle {
  private brand: string;

  constructor(brand: string) {
    this.brand = brand;
  }

  // 只能在类内部访问
  private displayBrand() {
    console.log(`Vehicle brand: ${this.brand}`);
  }
}

const vehicle = new Vehicle('Toyota');
// vehicle.displayBrand(); // 错误:Property 'displayBrand' is private and only accessible within class 'Vehicle'.

类的静态成员

静态成员属于类本身,而不是类的实例。静态成员通过static关键字定义。

class Utility {
  static PI = 3.14159;

  static calculateCircumference(radius: number) {
    return 2 * Utility.PI * radius;
  }
}

console.log(Utility.calculateCircumference(5)); // 输出: 31.4159

 总的来说,我认为类就是一个可以快捷的,可以快速创造出有相同特征的对象的工厂

TypeScript的继承

继承的基本概念

继承允许子类继承父类的属性和方法,这样子类就可以使用父类的代码,而不需要重新编写相同的代码。继承是面向对象编程中实现代码复用的一种方式。

使用extends关键字实现继承

在TypeScript中,使用extends关键字来创建一个类的子类。子类继承父类的所有属性和方法,并且可以添加新的属性和方法或者重写父类的方法。

class Animal {
  name: string;

  constructor(name: string) {
    this.name = name;
   }

  speak() {
    console.log(`${this.name} makes a noise.`);
   }
}

class Dog extends Animal {
  // Dog类继承了Animal类的属性和方法
  speak() {
    console.log(`${this.name} barks.`);
   }
}

方法重写和super关键字的使用

在子类中,我们可以通过重写方法来提供特定于子类的实现。如果子类需要调用父类的方法,可以使用super关键字。

class Cat extends Animal {
  speak() {
    console.log(`${this.name} meows.`);
   }

  // 调用父类的speak方法
  makeNoise() {
    super.speak(); // 输出: Cat name makes a noise.
    console.log(`${this.name} also meows.`);
   }
}

在上面的例子中,Cat类重写了Animal类的speak方法,并且在makeNoise方法中使用super.speak()调用了父类的speak方法。

继承的其他特性

  • 构造函数的继承:如果子类有构造函数,它必须首先调用super()来调用父类的构造函数。
  • 访问修饰符:在子类中,可以使用publicprotectedprivate访问修饰符来控制继承的属性和方法的可见性。
  • 静态成员的继承:子类可以继承父类的静态成员。

他的存在有什么意义呢?我们可以通过一个比较广泛的类来扩展出他的一些子类,比如说我有一个类叫‘动物’,  然后我想创建 ‘狗’, ‘猫’,通过继承‘动物’来创建类的话就不用重新把‘动物’的属性与方法重写一遍了,直接继承就可以了,这样可以少些很多代码

TypeScript的封装

封装的意义和实现方式

封装的意义在于:

1.数据隐藏:通过封装,可以隐藏对象的内部状态,只暴露必要的操作接口给外部,从而保护对象的数据不被外部直接访问和修改。

2.模块化:封装有助于将代码组织成独立的模块,每个模块负责自己的数据和操作,使得代码更加模块化和易于管理。

3.灵活性:封装允许对象的内部实现细节发生变化,而不会影响到使用该对象的外部代码,提高了代码的灵活性和可维护性。

在TypeScript中,实现封装的方式主要是通过访问修饰符来控制属性和方法的可见性。

访问修饰符的使用

TypeScript提供了以下访问修饰符:

  • public:默认修饰符,表示成员可以在任何地方被访问。
  • private:表示成员只能在类的内部被访问。
  • protected:表示成员可以在类及其子类中被访问。

属性和方法的封装

在TypeScript中,我们可以通过访问修饰符来封装属性和方法:

class Person {
  private name: string; // 私有属性,只能在类内部访问

  constructor(name: string) {
    this.name = name;
   }

  public getName(): string { // 公有方法,可以在类外部访问
    return this.name;
   }

  protected getInternalName(): string { // 受保护的方法,只能在类及其子类中访问
    return `Internal Name: ${this.name}`;
   }
}

class Employee extends Person {
  public getEmployeeName(): string {
    return this.getInternalName(); // 子类可以访问受保护的方法
   }
}

const person = new Person('Alice');
console.log(person.getName()); // 输出: Alice
// console.log(person.name); // 错误:Property 'name' is private and only accessible within class 'Person'.

TypeScript的封装

多态的概念和重要性

多态(Polymorphism)意味着“多种形态”。在编程中,它指的是同一个操作作用于不同的对象,可以有不同的解释和不同的执行结果。多态允许我们使用通用的接口来操作不同类型的对象,从而提高代码的可复用性和可维护性。

多态的重要性体现在:

1.代码复用:通过多态,我们可以编写通用的代码来处理不同类型的对象,减少了代码的重复。

2.可扩展性:多态使得添加新的对象类型变得更加容易,因为它们可以遵循已有的接口。

3.灵活性:多态允许我们延迟绑定,即在运行时确定对象的类型和方法的实现,增加了程序的灵活性。

抽象类和接口的使用

在TypeScript中,多态通常通过抽象类和接口来实现。

抽象类

抽象类是不能被实例化的类,它通常包含一个或多个抽象方法。抽象方法是只有声明没有具体实现的方法,它们必须在子类中被实现。

abstract class Animal {
  abstract makeSound(): void; // 抽象方法

  move(): void {
    console.log('Animal moves');
   }
}

class Dog extends Animal {
  makeSound(): void {
    console.log('Dog barks');
   }
}

const dog = new Dog();
dog.makeSound(); // 输出: Dog barks
dog.move(); // 输出: Animal moves
接口

接口定义了一组方法的规范,但不提供这些方法的具体实现。类可以实现一个或多个接口,这意味着类必须实现接口中定义的所有方法。

interface Singer {
  sing(): void;
}

class Musician implements Singer {
  sing(): void {
    console.log('Musician is singing');
   }
}

const musician = new Musician();
musician.sing(); // 输出: Musician is singing

实现多态的示例

多态通常通过继承和接口实现。下面是一个使用抽象类和接口实现多态的示例:

interface Vehicle {
  start(): void;
}

abstract class Car implements Vehicle {
  abstract start(): void;
}

class ElectricCar extends Car {
  start(): void {
    console.log('Electric car starts silently');
   }
}

class PetrolCar extends Car {
  start(): void {
    console.log('Petrol car starts with engine noise');
   }
}

const electricCar = new ElectricCar();
electricCar.start(); // 输出: Electric car starts silently

const petrolCar = new PetrolCar();
petrolCar.start(); // 输出: Petrol car starts with engine noise

TypeScript 泛型

泛型的基本概念

泛型可以理解为类型变量,它代表了一个或多个类型。在定义泛型时,你可以使用一个或多个类型变量来表示这些类型。这些类型变量在使用时会被实际的类型所替换。

泛型的使用

泛型函数

泛型函数允许你定义一个或多个类型参数,这些类型参数在函数被调用时会被指定。

function identity<T>(arg: T): T {
  return arg;
}

let output = identity<string>("myString");
// 或者使用类型推断
let output = identity("myString");

在这个例子中,identity函数有一个类型参数T,它表示函数可以接受任何类型的参数,并返回相同类型的值。

泛型接口

泛型接口允许你定义一个或多个类型参数,这些类型参数在实现接口时会被指定。

interface GenericIdentityFn<T> {
  (arg: T): T;
}

function identity<T>(arg: T): T {
  return arg;
}

let myIdentity: GenericIdentityFn<number> = identity;

在这个例子中,GenericIdentityFn是一个泛型接口,它有一个类型参数Tidentity函数实现了这个接口,并指定了Tnumber类型。

泛型类

泛型类允许你定义一个或多个类型参数,这些类型参数在创建类的实例时会被指定。

class GenericNumber<T> {
  zeroValue: T;
  add: (x: T, y: T) => T;
}

let myGenericNumber = new GenericNumber<number>();
myGenericNumber.zeroValue = 0;
myGenericNumber.add = function(x, y) { return x + y; };

在这个例子中,GenericNumber是一个泛型类,它有一个类型参数T。创建GenericNumber类的实例时,必须指定T的类型。

泛型约束

泛型约束允许你限制可以用于泛型参数的类型。通过使用extends关键字,你可以指定泛型参数必须满足的接口。

interface Lengthwise {
  length: number;
}

function loggingIdentity<T extends Lengthwise>(arg: T): T {
  console.log(arg.length);  // Now we know it has a .length property, so no more error
  return arg;
}

在这个例子中,loggingIdentity函数有一个泛型参数T,它必须满足Lengthwise接口,即必须有一个length属性。

泛型的好处

使用泛型可以带来以下好处:

  • 类型安全:泛型确保在编译时检查类型,避免类型错误。
  • 代码复用:泛型允许你编写可适用于多种数据类型的代码,提高代码的复用性。
  • 灵活性:泛型使得函数、接口或类可以灵活地处理不同类型的数据,而不需要为每种类型编写重复的代码。

总结

TypeScript结合OOP特性如类、继承、封装、多态和泛型,提供了强大的工具集来构建可维护、可扩展和类型安全的应用程序。

标签:TypeScript,name,多态,面向对象编程,泛型,方法,class
From: https://blog.csdn.net/a3098448071/article/details/140592702

相关文章

  • TypeScript体操(一):从基础到进阶
    目录前言UtilityTypes是什么?常用UtilityTypes前置知识`typeof``keyof``typeof`和`keyof`的区别`never`关键字`extends`关键字结合条件判断`infer`类型推断(模式匹配)判断是与非判断两个类型是否相等或兼容循环递归嵌套字符串数组协变(Covariance)逆变(Contravarian......
  • C++面向对象编程的一个核心概念--RAII
    RAII是"ResourceAcquisitionIsInitialization"(资源获取即初始化)的缩写,它是C++编程中的一种编程技术,用于管理资源的生命周期。RAII是C++面向对象编程的一个核心概念,它利用对象的构造函数和析构函数来自动管理资源,如内存、文件句柄、线程、互斥锁等。RAII的主要原则包括:1.*......
  • 如何从“.d.ts”文件生成 TypeScript API 文档?
    如何从.d.ts文件生成typescriptAPI文档?我尝试typedoc传输这个库:%npxtypedocindex.js[warning]Theentrypoint./index.jsisnotreferencedbythe'files'or'include'optioninyourtsconfig[error]Unabletofindan......
  • 深入理解面向对象编程(OOP)
    ......
  • TS 入门(七):TypeScript模块与命名空间
    目录前言回顾泛型编程1.模块a.导入和导出b.默认导出c.重命名导入和导出2.命名空间a.定义命名空间b.嵌套命名空间3.动态导入与条件导入a.动态导入b.条件导入结语前言在前几章中,我们学习了TypeScript的基础知识、函数与对象类型、接口与类、以及泛型编......
  • TypeScript
    TypeScriptTypeScript简介使用ts类型注解JS已有类型TS新增类型Typescript高级类型TypeScript简介1.ts是js的超集,在js的基础上,添加了类型支持(:表示)2.ts属于静态类型(编译期做类型检查)的编程语言,减少不同类型的赋值错误(意外行为),js属于动态类型(执行期进行类型检查)3.......
  • TS 入门(四):TypeScript 高级类型与类型操作
    目录前言回顾1.联合类型和交叉类型a.联合类型b.交叉类型2.字面量类型3.类型断言4.类型兼容性5.类型守卫a.`typeof`类型守卫b.`instanceof`类型守卫c.自定义类型守卫扩展知识点:类型映射(MappedTypes)结语前言在前三章中,我们介绍了TypeScript的基础知识......
  • Typescript 中 interface 和 type 的区别
    在TypeScript中,interface​和type​是用来描述对象结构或类型的两种主要方式,它们有一些区别和各自的特点。Interface(接口)定义方式:使用interface​关键字定义,例如:interfacePerson{name:string;age:number;}适用场景:主要用于描述对象的形状(Sh......
  • TS 入门(五):TypeScript接口与类
    目录前言回顾高级类型与类型操作1.接口a.基本接口b.可选属性和只读属性c.函数类型接口d.可索引类型e.接口继承2.类a.基本类b.类的成员(属性和方法)c.构造函数d.继承和派生类e.公有、私有和受保护的修饰符f.静态属性和方法g.抽象类扩展知识点:接口与类的结合......
  • vue3+element-plus+typescript
    1.vue3+ts+elementui-plushttps://blog.csdn.net/qq_41737571/article/details/1390730852.自动调整font-size大小https://blog.csdn.net/qq_41737571/article/details/1401586143.简单小众电商购物项目模板:基于Vue3和Vant4的纯前端开发方案https://web-hls.blog.csdn.......