Как реализовать интерфейс в TypeScript, который является attr ()?

#typescript

#typescript

Вопрос:

Я просто увидел код реактивной библиотеки Vue3. Однако я не знаком с TypeScript. Я не знаю, как реализовать интерфейс, подобный приведенному ниже:

 export interface ReactiveEffect<T = any> {
  (): T
  _isEffect: true
  id: number
}
  

Я думаю, что это ():T означает, что функция возвращает тип T. Если я объявлю интерфейс, подобный приведенному ниже:

 interface a {
  (): string,
}
  

Я могу реализовать его успешно, например:

 let b: a;
b = ():string => 'b';
  

Но я хочу знать, как реализовать интерфейс, который содержит attrs () и тому подобное ReactiveEffect .

Ответ №1:

В javascript функция является объектом, поэтому она может иметь свойства:

 function ReactiveEffectImpl() {}

ReactiveEffectImpl._isEffect = true;
ReactiveEffectImpl.id = id();
  

Комментарии:

1. да, это верно. Я понимаю, что вы имеете в виду. Но я не знаю, как писать на языке TypeScript. например: ReactiveEffectImpl реализует ReactiveEffect.

2. @uuz точно так же 🙂 . Интерфейс, который имеет сигнатуру вызова (т. Е. Имеет () ), может быть реализован только функцией. В объявление функции могут быть добавлены поля без явных объявлений, как указано выше. Хотя ReactiveEffectImpl он явно не реализует ReactiveEffect , он реализует его структурно, поэтому ReactiveEffectImpl будет присваиваться ReactiveEffect

3. @uuz как только вы назначаете свойства функции, измените тип, чтобы включить ее. Итак, как только вы назначаете эту функцию ReactiveEffect , она проверяет тип. ДЕМОНСТРАЦИЯ

4. @АлексейМартинкевич Thanks! Я понял. Отличное объяснение!

Ответ №2:

Вы можете использовать тип для определения вашей функции

 type func = ()=>string

interface some{
  a:string
  b:func
  c:number
}

let a:some = {a:"hi", c:6, b:()=>"hello"}