如何在typescript和rxjs中返回函数的回调返回类型

Question

我做了一个工厂函数，它接受回调，可以扩展主题的管道。

如何在subscribe函数中替换Observable<unknown>以获得正确的类型？

import './style.css';
console.clear();
import { of, map, tap, Observable, Subject } from 'rxjs';
const createSubject = <T>(
  factoryFn: ($: Observable<T>) => Observable<unknown>
) => {
  const sub = new Subject<T>();
  const r = factoryFn(sub.asObservable());
  function trigger(value: T) {
    sub.next(value);
  }
  trigger.$ = r;
  return trigger;
};
const login = createSubject<{ username: string }>(($) => {
  const temp = $.pipe(
    tap(() => {
      console.log('in subject!!!');
    }),
    map(({ username }) => ({ username, id: 1, password: 'password' }))
  );
  // typescript is know about temp type.
  // Observable<{  username: string;  id: number; password: string; }>
  return temp; // and it's returning.
});
login.$.subscribe((r) => {
  console.log({ r });
});
login({ username: 'username' });

我尝试过这些类型，但都不起作用：

const createSubject = <T>(
  factoryFn: ($: Observable<T>) => ReturnType<typeof factoryFn>
) => {
const createSubject = <T>(
  factoryFn: <ReturnType = U>($: Observable<T>) => U
) => {
const createSubject = <T>(
  factoryFn: <U>($: Observable<T>) => Observable<U>
) => {
const createSubject = <T>(
  factoryFn: ($: Observable<T>) => ReturnType
) => {

我想让typescript自己知道回调的返回。

堆叠式

Answer 1

这几乎是告诉编译器忘记关心返回的可观察类型：

factoryFn: ($: Observable<T>) => Observable<unknown>

您可以添加一个类型参数(R(，该参数将通过以下功能链接到输入(T(：

const createSubject = <T,R>(
  factoryFn: ($: Observable<T>) => Observable<R>
) => {
....
}

StackBlitz叉车

编译器无法执行代码，请参阅类型本身。它只使用您提供的信息。