TypeScript Generics

Assertion with as

<aside> ☝🏻 linkedList를, 재사용이 가능하게 만들고 싶어서, 꼭 Movie 타입 뿐만 아니라 어떤 object든 담을 수 있게 만들었다.

그러다 보니, MovieRank 안에서 linkedList 관련 로직을 쓸 때는, type을 변환(as keyword)해줘야 하는 귀찮음이 있었다.

</aside>

update: (title: string, tikets: number, startNode = headNode) => {
      // list를 map할 때, 특정 title을 가진 movie의 tikets를 업데이트
      const updateTikets = (value: object | null) => {
        if (value === null) return null;

        const movie = value as Movie;
        if (movie.title === title) {
          movie.tikets = tikets;
          return movie as object;
        }
        return value;
      };

      const moviesList = listValues(
        mapList(startNode, updateTikets)
      ) as Movie[];
      return createMovieRank(moviesList);
    },

mapList() 함수는 linkedList 관련 함수로, 좀 더 일반적인 object를 받는다.

그 안에 Movie가 들어갈 것을 나는 알지만, typeScript는 모르기 때문에, updateTikets라는 콜백 함수 안에서, movie **as** object으로 타입을 바꿔줘야 했다.

Generics with <T>

생각해보니, TypeScript에는 이럴 때를 위해 generic이 있었다. 이에 대해 더 학습해봤다.

우선, 타입을 이런 식으로 바꿀 수 있었다.

type ListNode<T> = {
  value: T | null;
  next: ListNode<T> | null;
};

const createNode = <T>(value: T | null): ListNode<T> => {
  return {
    value: value,
    next: null,
  };
};

이제 update()는 다음과 같아진다.

const update = (
  title: string,
  tikets: number,
  startNode: ListNode<Movie>
) => {
  // list를 map할 때, 특정 title을 가진 movie의 tikets를 업데이트
  const updateTikets = (value: Movie | null): Movie | null => {
    if (value === null) return null;

    if (value.title === title) {
      value.tikets = tikets;
      return value;
    }
    return value;
  };

  const updatedList = mapList(startNode, updateTikets);
  const moviesList = listValues(updatedList);

  return createMovieRank(moviesList); // Assuming createMovieRank is defined elsewhere
};

Type Assertion을 해주지 않아도 된다!

References

https://www.typescriptlang.org/docs/handbook/2/generics.html