TypeScript 中排除属性

Muhammad Maisam Abbas 2023年1月30日 2022年5月18日
  1. 在 TypeScript 中使用 Omit 从类型中排除属性
  2. 使用 Omit 修改 TypeScript 中的属性
TypeScript 中排除属性

本教程将讨论从 TypeScript 类型中排除属性。exclude 属性用于从现有类型创建具有较少或修改属性的另一种类型。

在 TypeScript 中使用 Omit 从类型中排除属性

TypeScript 允许用户从类型中排除属性。用户必须使用 Omit 类型从现有类型中排除属性。

Omit 类型从现有类型创建一个新类型。

语法:

Omit<Type_Name, 'property'>

例子:

type Info = {
    firstName: string,
    lastName: string,
    age: number,
    country: string,
};

type Info1 = Omit<Info, 'country'>;

const info1: Info1 = {
    firstName: 'John',
    lastName: 'Nash',
    age: 27,
};

console.log(info1);

输出:

{
    "firstName": "John",
    "lastName": "Nash",
    "age": 27
}

在上面的示例中,使用 Omit 从现有类型中引入了一个新类型。Info 类型有四个属性,而 Info1 有三个。

我们甚至可以从现有类型 Info 中引入一个新类型,并且可以排除多个属性。

例子:

type Info = {
    firstName: string,
    lastName: string,
    age: number,
    country: string,
};

type Info1 = Omit<Info, 'country'>;

const info1: Info1 = {
    firstName: 'John',
    lastName: 'Nash',
    age: 27,
};

type Info2 = Omit<Info, 'country' | 'age'>;

const info2: Info2 = {
    firstName: 'Stewen',
    lastName: 'Gold',
};

console.log(info1);
console.log(info2);

输出:

{
    "firstName": "John",
    "lastName": "Nash",
    "age": 27
}
{
    "firstName": "Stewen",
    "lastName": "Gold"
}

如上所示,类型 Info2 是类型 Info 的修改版本。请注意 Omit 类型中如何排除多个属性。

使用 Omit 修改 TypeScript 中的属性

TypeScript 允许用户修改属性。如果用户尝试修改没有 Omit 类型的类型,则会引发错误。

例子:

type Info = {
    firstName: string,
    lastName: string,
    age: number,
    country: string,
};

type Info1 = Info & {
    country: {
        countryName: string,
        cityName: string,
    };
};

const info1: Info1 = {
    firstName: 'John',
    lastName: 'Nash',
    age: 27,
    country: {
        countryName: 'China',
        cityName: 'Wuhan',
    },
}

此代码没有输出,因为对象 info1 属性 country 将引发错误。错误消息是:Type countryName and cityName is not assignable to type string

为了克服这个错误,用户必须使用 omit 类型来修改类型。

例子:

type Info = {
    firstName: string,
    lastName: string,
    age: number,
    country: string,
};

type Info1 = Omit<Info, 'country'> & {
    country: {
        countryName: string,
        cityName: string,
    };
};

const info1: Info1 = {
    firstName: 'John',
    lastName: 'Nash',
    age: 27,
    country: {
        countryName: 'China',
        cityName: 'Wuhan'
    },
}

console.log(info1);

输出:

{
    "firstName": "John",
    "lastName": "Nash",
    "age": 27,
    "country": {
        "countryName": "China",
        "cityName": "Wuhan"
    }
}

在上面的示例中,请注意 Info1 具有修改后的 country 类型。注意更新属性的语法。

使用 Omit 类型是消除复杂性和提高工作效率的好习惯。

Muhammad Maisam Abbas avatar Muhammad Maisam Abbas avatar

Maisam is a highly skilled and motivated Data Scientist. He has over 4 years of experience with Python programming language. He loves solving complex problems and sharing his results on the internet.

LinkedIn