菜单
×
   ❮   
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

TypeScript 实用工具类型


TypeScript 提供了大量的类型,可以帮助处理一些常见的类型操作,通常被称为实用工具类型。

本章将介绍最流行的实用工具类型。


Partial

Partial 将对象中的所有属性都变为可选。

示例

interface Point {
  x: number;
  y: number;
}

let pointPart: Partial<Point> = {}; // `Partial` 允许 x 和 y 是可选的
pointPart.x = 10;
自己动手试一试 »

必填

Required 将对象中的所有属性都变为必需。

示例

interface Car {
  make: string;
  model: string;
  mileage?: number;
}

let myCar: Required<Car> = {
  make: 'Ford',
  model: 'Focus',
  mileage: 12000 // `Required` 强制要求定义 mileage
};
自己动手试一试 »

Record(记录)

Record 是定义具有特定键类型和值类型的对象类型的快捷方式。

示例

const nameAgeMap: Record<string, number> = {
  'Alice': 21,
  'Bob': 25
};
自己动手试一试 »

Record<string, number> 等同于 { [key: string]: number }


w3schools CERTIFIED . 2022

获得认证!

完成 TypeScript 模块,做练习,参加考试,成为 W3Schools 认证!!

$45 报名

Omit

Omit 会从对象类型中移除指定的键。

示例

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

const bob: Omit<Person, 'age' | 'location'> = {
  name: 'Bob'
  // `Omit` 已从类型中移除了 age 和 location,因此无法在此处定义它们
};
自己动手试一试 »

Pick

Pick 会从对象类型中移除除指定键之外的所有键。

示例

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

const bob: Pick<Person, 'name'> = {
  name: 'Bob'
  // `Pick` 只保留了 name,因此 age 和 location 已从类型中移除,无法在此处定义它们
};
自己动手试一试 »

Exclude

Exclude 会从联合类型中移除指定的类型。

示例

type Primitive = string | number | boolean
const value: Exclude<Primitive, string> = true; // 这里不能使用 string,因为 Exclude 已将其从类型中移除。
自己动手试一试 »

ReturnType

ReturnType 提取函数类型的返回类型。

示例

type PointGenerator = () => { x: number; y: number; };
const point: ReturnType<PointGenerator> = {
  x: 10,
  y: 20
};
自己动手试一试 »

参数

Parameters 将函数类型的参数类型提取为数组。

示例

type PointPrinter = (p: { x: number; y: number; }) => void;
const point: Parameters<PointPrinter>[0] = {
  x: 10,
  y: 20
};
自己动手试一试 »

只读

Readonly 用于创建一个新类型,其中所有属性都是只读的,这意味着一旦赋值,它们就不能被修改。

请注意,TypeScript 会在编译时阻止此操作,但理论上由于它被编译成 JavaScript,你仍然可以覆盖只读属性。

示例

interface Person {
  name: string;
  age: number;
}
const person: Readonly<Person> = {
  name: "Dylan",
  age: 35,
};
person.name = 'Israel'; // prog.ts(11,8): error TS2540: 无法分配给 'name',因为它是一个只读属性。
自己动手试一试 »

TypeScript 练习

通过练习来测试自己

练习

声明一个名为 kindPerson 的对象,该对象来自 Person 接口,其中所有属性都是可选的

interface Person {
    age: number;
    firstName: string;
    lastName: string;
}
            
let :  = {};

开始练习


×

联系销售

如果您想将 W3Schools 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持