Menu
×
   ❮   
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

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; // 字符串不能在这里使用,因为 Exclude 已将其从类型中删除。
自己尝试 »

ReturnType

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

示例

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

Parameters

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

示例

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

Readonly

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: Cannot assign to 'name' because it is a read-only property.
自己尝试 »

TypeScript 练习

通过练习测试自己

练习

从 Person 接口声明一个 kindPerson 对象,其中所有属性都是可选的

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

开始练习


×

Contact Sales

If you want to use W3Schools services as an educational institution, team or enterprise, send us an e-mail:
[email protected]

Report Error

If you want to report an error, or if you want to make a suggestion, send us an e-mail:
[email protected]

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Copyright 1999-2024 by Refsnes Data. All Rights Reserved. W3Schools is Powered by W3.CSS.