TypeScript中的接口是什么?如何定义和使用接口?

在 TypeScript 中,接口(Interface)用于定义对象的结构和类型。接口描述了对象应该具有的属性、方法和类型约束,它们提供了一种结构化的方式来定义和使用数据。

  接口的定义使用 interface 关键字,可以包含属性、方法、索引签名等。以下是一个简单的接口定义示例:

typescript 复制代码
interface Person {
  name: string;
  age: number;
  sayHello: () => void;
}

  在上面的示例中,我们定义了一个名为 Person 的接口,它要求具有 name 属性(字符串类型)、age 属性(数字类型)和 sayHello 方法(没有参数和返回值)。

  接口的使用主要有两种方式:对象实现接口变量类型注解

  1. 对象实现接口:

  通过实现接口,我们可以确保对象的结构符合接口的要求。示例如下:

typescript 复制代码
interface Person {
  name: string;
  age: number;
  sayHello: () => void;
}

const person: Person = {
  name: "John",
  age: 25,
  sayHello: () => {
    console.log("Hello!");
  },
};
}

  在上面的示例中,我们创建了一个 person 对象,并确保它符合 Person 接口的结构要求。

  1. 变量类型注解:

  我们可以使用接口作为变量的类型注解,来限制变量的类型。示例如下:

typescript 复制代码
interface Person {
  name: string;
  age: number;
  sayHello: () => void;
}

function greet(person: Person) {
  console.log(`Hello, ${person.name}!`);
}

const john = {
  name: "John",
  age: 25,
  sayHello: () => {
    console.log("Hello!");
  },
};

greet(john);

  在上面的示例中,我们定义了一个 greet 函数,它接受一个参数 person,类型为 Person 接口。在调用 greet 函数时,传入符合 Person 接口要求的对象 john。

相关推荐
LabVIEW开发18 分钟前
LabVIEW 前面板装饰图形的格式选择与自定义选板添加
前端·labview·labview知识·labview功能·labview程序
掘金者阿豪25 分钟前
GPT-6 Astra 来了,GPT-5.6 Sol 还值得用吗?聊聊 Coding、百万上下文、价格和 Plus/Pro
前端·后端
code 小楊26 分钟前
腾讯开源 WeKnora 深度解析:RAG 问答 + ReAct Agent 推理 + 自动 Wiki 图谱,三位一体的企业级知识中台
前端·人工智能·开源·知识图谱
roamingcode31 分钟前
让 AI 的回答「逐段说话」:react-streaming 的顺序流式渲染实践
前端·人工智能·react.js·codex
BioRunYiXue33 分钟前
科研干货 | IC50全面解读:概念解析、实验设计与数据分析要点
java·开发语言·javascript·人工智能·算法·数据挖掘·数据分析
cidy_9839 分钟前
Main 正式环境合并说明
前端
万物智能42 分钟前
开源鸿蒙内核配置与驱动三条路径—【万物智能之开源鸿蒙OpenHarmony系统实战开发系列教程】
前端·后端
每天吃饭的羊43 分钟前
WebAssembly
开发语言·javascript·wasm
hunterandroid43 分钟前
Android 多渠道打包与 Gradle 构建优化实战
android·前端·kotlin
cidy_981 小时前
Develop 测试环境合并说明
前端