迹忆客 专注技术分享

使用 Omit 实用程序类型从接口中删除属性，例如 type WithoutAge = Omit<Person, 'age'>。 Omit 实用程序类型通过从现有接口中删除指定的键来构造新类型。

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

// ✅ Remove 'age' property from interface
type WithoutAge = Omit<Person, 'age'>;

// ✅ Remove multiple properties from interface
type WithoutAgeAndAddress = Omit<Person, 'age' | 'address'>;

// ✅ Remove property and extend interface
interface PersonWithoutAge extends Omit<Person, 'age'> {
  language: string;
}

我们可以使用 Omit 实用程序类型从接口中删除一个或多个属性。

前两个示例创建了一个类型而不是接口，因为我们只是简单地从接口中删除属性而不扩展它（向它添加新属性）。

在不向其添加任何属性的情况下进行扩展和接口是没有意义的，因此声明一个类型更直观。

在第三个示例中，我们从 Person 类型中删除了 age 属性，并使用 language 属性扩展了新构造的类型。

这是上面示例的更详细版本，我们在其中创建符合新构造类型的创建对象。

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

// ✅ Remove 'age' property from interface
type WithoutAge = Omit<Person, 'age'>;

const obj1: WithoutAge = {
  name: 'Tom',
  address: 'Example str 123',
};

// ✅ Remove multiple properties from interface
type WithoutAgeAndAddress = Omit<Person, 'age' | 'address'>;

const obj2: WithoutAgeAndAddress = {
  name: 'Alfred',
};

// ✅ Remove property and extend interface
interface PersonWithoutAge extends Omit<Person, 'age'> {
  language: string;
}

const obj3: PersonWithoutAge = {
  name: 'James',
  address: 'Example str 123',
  language: 'English',
};

我们经常会看到在覆盖特定属性的类型时使用的 Omit 实用程序类型。

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

// ✅ Remove property to change its type
interface PersonWithVerboseAddress extends Omit<Person, 'address'> {
  address: {
    country: string;
    city: string;
  };
}

const obj3: PersonWithVerboseAddress = {
  name: 'James',
  age: 30,
  address: {
    country: 'Chile',
    city: 'Santiago',
  },
};

我们从 Person 接口中删除了 address 属性，然后将其类型更改为对象。

这比将我们需要的属性从 Person 接口复制到另一个接口要好得多，因为我们仍然向代码的读者发出信号，表明这两个接口之间存在关系。

如果我们试图直接覆盖 address 属性而不首先将其从接口中排除，我们会得到一个错误，因为两个接口上的地址属性类型之间存在冲突。

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

// ⛔️ Error: Type {country: string; city: string} is not
// assignable to type 'string'
// Types of property 'address' are incompatible
interface PersonWithVerboseAddress extends Person {
  address: {
    country: string;
    city: string;
  };
}