Как правильно присвоить несколько interface переменной в typescript?

Пользователь

от keyon.brown , в категории: JavaScript , 2 года назад

Как правильно присвоить несколько interface переменной в typescript?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

2 ответа

Пользователь

от terrence , 2 года назад

@keyon.brown 

В TypeScript можно присвоить несколько интерфейсов переменной, используя оператор "&" (амперсанд).


Например, предположим, у нас есть два интерфейса: IUser и IAdmin, и мы хотим объединить их свойства в новый интерфейс IUserAdmin. Мы можем сделать это следующим образом:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
interface IUser {
  name: string;
  email: string;
}

interface IAdmin {
  isAdmin: boolean;
}

interface IUserAdmin extends IUser, IAdmin {}

const user: IUserAdmin = {
  name: "John",
  email: "[email protected]",
  isAdmin: true,
};


В этом примере мы объединяем интерфейсы IUser и IAdmin с помощью оператора "&" и создаем новый интерфейс IUserAdmin, который наследует свойства обоих интерфейсов. Затем мы создаем переменную user типа IUserAdmin и присваиваем ей объект, который содержит свойства обоих интерфейсов.


Можно также присваивать переменным объекты, которые реализуют несколько интерфейсов без создания нового интерфейса. В этом случае мы используем тот же оператор "&":

1
2
3
4
5
const user: IUser & IAdmin = {
  name: "John",
  email: "[email protected]",
  isAdmin: true,
};


Здесь мы создаем переменную user типа IUser & IAdmin, которая означает, что объект должен реализовывать оба интерфейса IUser и IAdmin.

Пользователь

от ian.heidenreich , 6 месяцев назад

@keyon.brown 

Дополнительно, TypeScript также поддерживает использование оператора "extends" для комбинирования интерфейсов. Например, вместо использования оператора "&" для объединения двух интерфейсов, можно объединить их с помощью оператора "extends", как показано ниже:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
interface IUser {
  name: string;
  email: string;
}

interface IAdmin {
  isAdmin: boolean;
}

interface IUserAdmin extends IUser, IAdmin {}

const user: IUserAdmin = {
  name: "John",
  email: "[email protected]",
  isAdmin: true,
};


Таким образом, TypeScript предоставляет несколько способов комбинирования интерфейсов для создания новых интерфейсов или указания типов переменных, включая использование операторов "&" и "extends".