더북(TheBook)

그러면 이 에러를 해결하기 위해 반환 타입을 설정해 주어야 하는데, 이미 그림 4-7에 반환 타입에 대한 힌트가 모두 나와 있습니다. { id: number; title: string; done: boolean; }[]이라는 값이 보이죠? 이것이 바로 비주얼 스튜디오 코드에서 내부적으로 타입스크립트를 해석해서 사용자에게 표시해 준 반환 타입입니다. 따라서 해당 타입을 다음과 같이 지정할 수 있습니다.

function fetchTodoItems(): { id: number; title: string; done: boolean }[] {
  const todos = [
    { id: 1, title: '안녕', done: false },
    { id: 2, title: '타입', done: false },
    { id: 3, title: '스크립트', done: false },
  ];
  return todos;
}

fetchTodoItems() 함수가 todos라는 배열이 담긴 변수를 반환하고 있기 때문에 함수의 반환 타입은 todos 변수의 데이터 타입이어야 합니다. 여기에서 아마 이렇게 구체적으로 타입을 정의하지 않고 any[]로 작성한 사람들도 있을 텐데요. 첫 번째 실습에서 중요한 것은 지금까지 배운 내용을 이용하여 직접 코드를 작성하는 것이므로 타입이 더 적절하다 적절하지 않다는 중요하지 않습니다. 경고 표시만 사라지도록 타입을 정의하면 됩니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.