返回

TypeScript新手入门：掌握接口、函数与类

前端

TypeScript是一门流行的编程语言，它在JavaScript的基础上增加了类型系统，使开发者能够编写出更健壮、更易维护的代码。在本文中，我们将介绍TypeScript中最重要的三个概念：接口、函数和类。

接口

接口是TypeScript中用来对象或类的具体结构的一种工具。它定义了对象或类必须拥有的属性和方法，以及这些属性和方法的类型。接口可以帮助我们更好地组织代码，并确保代码的正确性。

定义接口

interface Person {
  name: string;
  age: number;
}

这个接口定义了一个名为Person的对象，该对象必须具有name和age两个属性，其中name的类型为string，age的类型为number。

使用接口

let person: Person = {
  name: "John Doe",
  age: 30
};

这个代码创建一个名为person的变量，其类型为Person。这意味着person变量必须具有name和age两个属性，并且这两个属性的类型必须分别为string和number。

函数

函数是TypeScript中用来执行特定任务的一组代码块。函数可以接受参数，并返回一个值。

定义函数

function add(a: number, b: number): number {
  return a + b;
}

这个函数定义了一个名为add的函数，该函数接受两个数字参数a和b，并返回这两个数字的和。

调用函数

let result = add(1, 2);
console.log(result); // 3

这个代码调用了add函数，并把结果存储在result变量中。然后，它使用console.log()函数把result变量的值输出到控制台。

类

类是TypeScript中用来创建对象的蓝图。类可以定义属性和方法，并且可以从其他类继承属性和方法。

定义类

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.`);
  }
}

这个类定义了一个名为Person的类，该类具有name和age两个属性，以及一个名为greet()的方法。

创建类实例

let person = new Person("John Doe", 30);
person.greet(); // Hello, my name is John Doe and I am 30 years old.

这个代码创建了一个名为person的新Person对象，并调用了该对象的greet()方法。

结语

接口、函数和类是TypeScript中最重要的三个概念。通过理解这些概念，您将能够轻松地构建自己的TypeScript应用程序。