TypeScript基础(四)扩展类型 - 类

引言

TypeScript是一种静态类型的编程语言,它是JavaScript的超集,可以编译成纯JavaScript代码。TypeScript引入了类的概念,使得开发者可以使用面向对象的方式来编写代码。本文将介绍TypeScript的类、继承、访问修饰符和访问器的用法。

类是一种模板或蓝图,用于创建具有相同属性和方法的对象。在TypeScript中,可以使用关键字class来定义一个类。类可以包含属性(成员变量)和方法(成员函数)。

下面是一个简单的示例,展示了如何定义一个名为Person的类,并在其中定义了一个属性name和一个方法sayHello()

typescript 复制代码
class Person {
  name: string;
  constructor(name: string) {
    this.name = name;
  }
  sayHello() {
    console.log(`Hello, my name is ${this.name}.`);
  }
}

const person = new Person("Alice");
person.sayHello(); // 输出:Hello, my name is Alice.

在上面的例子中,我们首先使用关键字class定义了一个名为Person的类。然后,在类中定义了一个属性name和一个方法sayHello()。属性和方法都可以通过访问修饰符(如public, private, protected)来控制其可见性。

构造函数是一种特殊类型的方法,在创建对象时被调用。在上面的例子中,我们使用关键字constructor定义了一个构造函数,并在其中接收一个参数并将其赋值给属性name

继承

继承是一种面向对象编程的重要概念,它允许一个类继承另一个类的属性和方法。在TypeScript中,可以使用关键字extends来实现继承。

下面是一个示例,展示了如何定义一个名为Student的子类,并继承自父类Person

typescript 复制代码
class Student extends Person {
  grade: number;

  constructor(name: string, grade: number) {
    super(name);
    this.grade = grade;
  }

  study() {
    console.log(`${this.name} is studying in grade ${this.grade}.`);
  }
}

const student = new Student("Bob", 5);
student.sayHello(); // 输出:Hello, my name is Bob.
student.study(); // 输出:Bob is studying in grade 5.

在上面的例子中,我们使用关键字extends将子类Student与父类Person进行了继承。子类可以访问父类中的属性和方法,并且还可以添加自己的属性和方法。

在子类的构造函数中,我们使用关键字super()调用父类的构造函数,并传递相应的参数。这样可以确保父类中定义的属性得到正确地初始化。

访问修饰符

在TypeScript中,类的访问修饰符用于控制类的属性和方法的可访问性。TypeScript提供了三种访问修饰符:publicprivateprotected

  1. public: 默认的访问修饰符,表示属性或方法可以在类的内部和外部被访问。
typescript 复制代码
class Person {
  public name: string;
  constructor(name: string) {
    this.name = name;
  }
}
const person = new Person("John");
console.log(person.name); // 输出:John
  1. private: 表示属性或方法只能在类的内部被访问,外部无法访问。
typescript 复制代码
class Person {
  private name: string;
  constructor(name: string) {
    this.name = name;
  }
  getName() {
    return this.name;
  }
}
const person = new Person("John");
console.log(person.getName()); // 输出:John
console.log(person.name); // 错误:属性"name"为私有属性,只能在类"Person"中访问。
  1. protected: 表示属性或方法可以在类的内部和子类中被访问,外部无法访问。
typescript 复制代码
class Person {
  protected age: number;
  constructor(age: number) {
    this.age = age;
  }
  getAge() {
    return this.age;
  }
}
class Employee extends Person {
  private salary: number;
  constructor(age: number, salary: number) {
    super(age);
    this.salary = salary;
  }
  getSalary() {
    return this.salary;
  }
}
const employee = new Employee(25, 5000);
console.log(employee.getAge()); // 输出:25
console.log(employee.getSalary()); // 输出:5000
console.log(employee.age); // 错误:属性"age"受保护,只能在类"Person"及其子类中访问。

在上面的示例中,我们定义了一个名为Person的基类,并使用不同的访问修饰符来限制属性和方法的可访问性。然后我们定义了一个名为Employee的子类,并继承了基类。子类可以访问基类中被标记为protected或者public的属性和方法。

通过使用不同的访问修饰符,我们可以控制属性和方法的可见性,从而提高代码的安全性和可维护性。

访问器

TypeScript中的访问器(Accessors)是一种特殊的方法,用于控制对类的属性的访问。访问器由getset关键字定义,分别用于获取和设置属性的值。通过使用访问器,可以在属性被读取或写入时执行特定的逻辑。

下面是一个示例,展示了如何使用访问器来控制对类的属性的访问:

typescript 复制代码
class Person {
  private _name: string = 'A'

  get name(): string {
    return this._name;
  }

  set name(value: string) {
    if (value.length < 3) {
      throw new Error("Name must be at least 3 characters long.");
    }
    this._name = value;
  }
}

const person = new Person();
person.name = "Alice";
console.log(person.name); // 输出:Alice

person.name = "Bob";
console.log(person.name); // 输出:Bob

person.name = "Tom";
console.log(person.name); // 输出:Tom

person.name = "Li"; // 抛出错误:Name must be at least 3 characters long.

在上面的例子中,我们定义了一个名为Person的类,并在其中定义了一个私有属性_name。然后,我们使用访问器来控制对该属性的访问。

通过定义一个名为name的get方法,我们可以获取属性值。在这个例子中,get方法返回私有属性_name

通过定义一个名为name的set方法,我们可以设置属性值。在这个例子中,set方法首先检查传入的值的长度是否小于3个字符,如果是,则抛出一个错误。否则,将传入的值赋给私有属性_name

在使用访问器时,我们可以像访问普通属性一样使用它们。在上面的例子中,我们通过person.name = "Alice"来设置属性值,并通过console.log(person.name)来获取属性值。

通过使用访问器,我们可以在对属性进行读取和写入时执行特定的逻辑。这使得我们可以对属性进行更加精细的控制和验证。


TypeScript基础(一)基本类型与类型运算

TypeScript基础(二)扩展类型-枚举及其位运算

TypeScript基础(三)扩展类型-接口和类型兼容性


总结

TypeScript的类、继承、访问修饰符和访问器在面向对象编程中起着重要的作用,可以帮助开发者更好地组织和管理代码。

  • 类:类是一种模板或蓝图,用于创建具有相同属性和方法的对象。通过定义类,可以将相关的属性和方法封装在一起,提高代码的可读性和可维护性。

  • 继承:继承是一种面向对象编程的重要概念,它允许一个类继承另一个类的属性和方法。通过继承,子类可以复用父类中已有的代码,并且还可以添加自己特定的属性和方法。这样可以减少代码重复,并提高代码的可复用性。

  • 访问修饰符:访问修饰符用于控制类中成员(属性和方法)的可见性。TypeScript提供了三种访问修饰符:publicprivateprotected

    • public:公共成员可以在任何地方被访问,默认情况下所有成员都是公共的。
    • private:私有成员只能在定义它们的类内部被访问。
    • protected:受保护成员可以在定义它们的类及其子类中被访问。
  • 访问器:访问器是一种特殊的方法,用于控制对类的属性的访问。通过使用访问器,可以在属性被读取或写入时执行特定的逻辑。访问器由getset关键字定义,分别用于获取和设置属性的值。通过使用访问器,可以对属性进行更加精细的控制和验证。

相关推荐
吕彬-前端19 分钟前
使用vite+react+ts+Ant Design开发后台管理项目(五)
前端·javascript·react.js
学前端的小朱22 分钟前
Redux的简介及其在React中的应用
前端·javascript·react.js·redux·store
guai_guai_guai31 分钟前
uniapp
前端·javascript·vue.js·uni-app
bysking1 小时前
【前端-组件】定义行分组的表格表单实现-bysking
前端·react.js
王哲晓2 小时前
第三十章 章节练习商品列表组件封装
前端·javascript·vue.js
fg_4112 小时前
无网络安装ionic和运行
前端·npm
理想不理想v2 小时前
‌Vue 3相比Vue 2的主要改进‌?
前端·javascript·vue.js·面试
酷酷的阿云2 小时前
不用ECharts!从0到1徒手撸一个Vue3柱状图
前端·javascript·vue.js
微信:137971205872 小时前
web端手机录音
前端
齐 飞2 小时前
MongoDB笔记01-概念与安装
前端·数据库·笔记·后端·mongodb