타입스크립트와 자바스크립트의 차이
- 타입스크립트 : 타입을 활용해서 대규모 서비스 등에 유용합니다.
- 자바스크립트 : 타입프리(Type Free), 대부분의 케이스에서 알아서 잘 동작합니다.
- 두 언어의 용법은 크게 다르지 않습니다.
데이터의 인터페이스를 지정해주는 게 타입스크립트에서 굉장히 중요합니다.
타입스크립트가 존재하는 가장 큰 의의 : 데이터가 어떻게 생겼는지 정의하는 것(=인터페이스)입니다.
타입스크립트는 앱 내에서 돌아가는 데이터들을 정리하는 목적으로 쓰입니다.
유저데이터를 가져오는 배열로 가져오는 케이스가 많습니다.
- 인터페이스를 보며 각각의 타입이 어떻게 생겼는지 파악해서 데이터가 들어오면 어떻게 처리를 하면 되겠구나 하는 식으로 개발을 보다 수월하게 할 수 있습니다.
MOCK_API 를 만들어서 객체의 배열로 데이터를 받아올때 간단한 코드 예시
// type.ts
export interface UserData {
name: string;
company: string;
age?: number;
}
export interface UserAPIData {
userData: [UserData];
}
// App.jsx
import { UserAPIData } from "./type";
const MOCK_API: UserAPIData = {
userData: [
{
name: "Eun Cho",
company: "오늘의집",
},
],
};
// 컴포넌트 분리
const User = (): JSX.Element => {
const { name, company } = MOCK_API.userData[0];
return (
<div>
<h1>{name}</h1>
<h2>{company}</h2>
</div>
);
};
export default function App() {
return <User />;
}
결론 : 위의 장점들과 타입스크립트로 인한 에디터 프로그램이 제공하는 정보들을 활용하여 생산성이 향상됩니다.