[Typescript, Array] interface Array type 지정해보자!

안녕하세요! 오늘은 프로젝트 도중 Array 타입지정을 하는 방법을 알아보겠습니다! 🥷

우선 기본적으로 interface는 object를 다룹니다.

interface IFood {
	name: string;
	leftTime: string;
}

이런 식으로 말이죠!

 

그렇다면 이 인터페이스를 배열에 사용하고 싶으면 어떡해야할까요? 우리는 이 오브젝트를 가진 배열을 타입으로 지정해줘야 한다면 우리는 어떠한 행위를 해야할까요?! 🤔

 

그 것은 바로 IFood를 가지는 Array를 새로 만들어주어야 합니다! 한 번 코드로 확인해봅시다!

interface IFood {
	name: string;
	leftTime: string;
}

interface IFoods extends Array<IFood> {}

자 우린 IFood object를 갖는 IFoods라는 새로운 array interface를 만들었습니다. 이렇게 우리는 타입을 갖는 배열을 만들 수 있게 된거죠! 이제 IFoods를 통해 배열의 타입을 지정해줄 수 있습니다. 이런 식으로 말이죠! 🏃🏻‍♂️

 

export const foodState = atom<IFoods>({
	key: 'food',
	default: [
		{ name: '달걀', leftTime: '2022/04/21' },
		{ name: '우유', leftTime: '2022/05/19' },
	],
});

 

오늘도 새롭게 배열의 타입을 지정하는 법을 배웠습니다. 👏🏻 any로 해결할 수도 있겠지만, any를 여기저기 떡칠해버리면 타입스크립트를 굳이 이용하는 이유가 퇴색되어 버리죠 🥲

 

우리 귀찮아도 열심히 타입 지정해서, 후에 사이드이팩트를 최소화하고 유지보수 쉬운 코드를 만드는데 힘써보아요!

 

오늘도 읽어주셔서 감사합니다! 도움이 되었다면 좋겠습니다 😇