Interface 말고 ReturnType<T>, const assertion

Redux 사용 시 액션의 타입을 인터페이스를 이용해서 지정해 줄 수 있는데, 이 경우 코드의 길이가 길어지고 동일한 부분이 중복된다.

이때, ReturnType 제네릭타입과 const assertion을 활용하면 중복없이 코드 길이를 줄일 수 있다.

ReturnType<>

특정 함수의 반환 타입을 추출해내는 제네릭 타입

const ADD_TODO = 'ADD_TODO'

function addTodo(title: string) {
  return <const>{
    type: ADD_TODO,
    payload: {
      title
    }
  }
}

type AddTodoAction = ReturnType<typeof addTodo>
                                
/*
type AddTodoAction = { type: string;
                       payload: {
                         title: string
                       }   
                     }
*/

const assertion

타입 추론

정적 타입 언어에 포함된 기능. 변수에 대입하는 '리터럴의 타입'을 보고 변수의 타입을 자동으로 지정해준다.

let Tommy: string = "cat";

let Tommy = "cat"

변수를 let으로 선언하느냐, const로 선언하느냐에 따라 타입 추론이 달라진다.

as const

let으로 선언한 변수에 as count를 붙이면 const 변수로 선언한 것 처럼 추론한다.

Reference

• Typescript + Redux 액션 타이핑
• Redux, Typescript, React