TypeScript类与对象:面向对象编程的基础

引言

TypeScript 是 JavaScript 的一个超集,它为 JavaScript 添加了静态类型、类、接口和装饰器等面向对象编程的特性,并通过编译器将 TypeScript 编译成JavaScript,可以在任何 JavaScript 环境中运行,因此成为了 JavaScript 开发中不可或缺的工具。面向对象编程是现代编程语言的基础,而 TypeScript 的类与对象是实现面向对象编程的基础。

类的定义

  • 和 JavaScript 一样,TypeScript 中的类也使用 class 关键字进行定义,定义类的语法如下:

    class ClassName {
          
          
        //类成员的定义
    }
    
  • 类成员可以包含属性方法构造函数静态成员等。

属性

  • 类的属性可以通过直接在类中定义变量的方式实现。属性可以是普通的变量,也可以是类对象。

    class Person {
          
          
        name: string;
        age: number;
    }
    
  • 在上面的例子中,我们定义了一个名为 Person 的类,它有两个属性,一个是 name ,一个是 age 。

方法

  • 类的方法可以使用 function 关键字进行定义,也可以使用箭头函数进行定义。方法可以有返回值,也可以没有返回值

    class Person {
          
          
        name: string;
        age: number;
        sayHello():void {
          
          
            console.log(`Hello, my name is ${
            
            this.name}, I'm ${
            
            this.age} years old`);
        }
        // 或者使用箭头函数的方式:sayHello: () => console.log(`Hello, my name is ${this.name}, I'm ${this.age} years old`)
    }
    
  • 在上面的例子中,我们定义了一个名为 Person 的类,它有两个属性,一个是 name ,一个是 age。还定义了一个名为 sayHello 的方法,它没有返回值,当被调用时,会输出当前对象的 name 和 age 。

构造函数

  • 类的构造函数用于初始化类的对象。和 JavaScript 一样,TypeScript 的构造函数使用 constructor 关键字进行定义。

    class Person {
          
          
        name: string;
        age: number;
        constructor(name: string, age: number) {
          
          
            this.name = name;
            this.age = age;
        }
    }
    
  • 在上面的例子中,我们定义了一个名为 Person 的类,它有两个属性,一个是 name ,一个是 age 。还定义了一个构造函数,它会接受一个名为 name 的字符串和一个名为 age 的数值,用于初始化当前对象的 name 和 age 属性。

静态成员

  • 静态成员用于在类的实例之间共享数据。在 TypeScript 中,静态成员使用 static 关键字进行定义。

    class Person {
          
          
        name: string;
        age: number;
        static total: number = 0;
        constructor(name: string, age: number) {
          
          
            this.name = name;
            this.age = age;
            Person.total++;
        }
    }
    
  • 在上面的例子中,我们定义了一个名为 Person 的类,它有两个属性,一个是 name ,一个是 age 。还定义了一个静态成员 total ,用于记录当前类已经创建的对象的个数。每当构造函数被调用时,就会将 total 加 1 ,从而实现对 total 的更新。

对象的创建

  • 在 TypeScript 中,创建对象需要先创建类的实例。创建类实例的方式有两种:

使用 new 关键字

  • 使用 new 关键字创建类实例是最常用的方式。

    let person1 = new Person("Tom", 18);
    
  • 在上面的例子中,我们创建了一个名为 person1 的变量,它是 Person 类的实例,使用构造函数初始化了它的 name 和 age 属性。

使用对象字面量

  • 使用对象字面量创建类实例通常用于创建没有自定义构造函数的类。

    let person2: Person = {
          
          
        name: "Jerry",
        age: 20,
        sayHello: () => console.log("Hello")
    };
    
  • 在上面的例子中,我们创建了一个名为 person2 的变量,它是 Person 类的实例,使用对象字面量初始化了它的 name、age 和 sayHello 属性。

继承与多态

继承

  • 继承是面向对象编程中的一种重要概念,它允许一个类从另一个类中继承属性方法。和 JavaScript 一样,在 TypeScript 中,继承使用 extends 关键字进行定义。

    class Student extends Person {
          
          
        grade: number;
        constructor(name: string, age: number, grade: number) {
          
          
            super(name, age);
            this.grade = grade;
        }
        sayHello(): void{
          
          
            console.log(`Hello, my name is ${
            
            this.name}, I'm ${
            
            this.age} years old, I'm in grade ${
            
            this.grade}`);
        }
    }
    
  • 在上面的例子中,我们定义了一个名为 Student 的类,它继承了 Person 类的所有属性和方法,并增加了一个名为 grade 的属性,用于表示学生的年级。还重写了父类的 sayHello 方法,用于输出当前对象的所有属性。

多态

  • 多态是面向对象编程中的一种重要概念,它允许不同对象调用相同方法的行为表现不同。在 TypeScript 中,实现多态需要使用抽象类接口

  • 抽象类是一种不能被直接实例化的类,它只能被继承。抽象类可以包含抽象方法普通方法

    • 抽象方法是没有实现的方法,它的实现需要在子类中完成
    abstract class Animal {
          
          
        abstract makeSound(): void;
        move(): void {
          
          
            console.log("I'm moving");
        }
    }
    
  • 在上面的例子中,我们定义了一个名为 Animal 的抽象类,它有一个抽象方法 makeSound 和一个普通方法 move 。makeSound 方法没有实现,需要在子类中完成。

  • 接口是一种用于定义对象的结构、属性和方法的类型。

    • 接口只是一个类型声明,它没有实现任何行为
    interface Shape {
          
          
        area(): number;
    }
    class Circle implements Shape {
          
          
        radius: number;
        constructor(radius: number) {
          
          
            this.radius = radius;
        }
        area(): number {
          
          
            return this.radius * this.radius * Math.PI;
        }
    }
    class Square implements Shape {
          
          
        length: number;
        constructor(length: number) {
          
          
            this.length = length;
        }
        area(): number {
          
          
            return this.length * this.length;
        }
    }
    
  • 在上面的例子中,我们定义了一个名为 Shape 的接口,它有一个名为 area 的方法。还定义了两个实现了 Shape 接口的类,Circle 和 Square ,它们都实现了 area 方法,但是计算面积的方式不同。

总结

类与对象是面向对象编程的基础,通过类的定义,我们可以创建对象,并封装属性和方法。通过继承和多态,我们可以实现代码的复用和扩展。TypeScript 通过添加静态类型、类、接口和装饰器等特性,进一步增强了 JavaScript 的面向对象编程能力。熟练掌握 TypeScript 的类与对象,可以帮助我们快速开发高质量的JavaScript 应用程序。

猜你喜欢

转载自blog.csdn.net/McapricornZ/article/details/131273084
今日推荐