TypeScript interface cheat sheet

타입스크립트로 타입을 정해주면서 가장 헷갈렸던게

않이 이거 함수를 어떻게 정해주지..? 였읍니다.

---

😲기본적인 형태

interface login {
  (username:string, password:string) : boolean
}

let loginUser: login = (username:string, password:string) => {
  console.log('엄')
  return true
}

기본적인 사용례는 다음과 같이 표현할 수 있습니다.

타입을 통해 표현하는 경우 다음과 같아집니다.

type login = {
  (username:string, password:string) : boolean
}

let loginUser: login = (username:string, password:string) => {
  console.log('엄')
  return true
}

---

😲파라미터에도 타입을 줄 수 있다.

interface LoginArguments {
  id: number;
  password: string;
}

const login = ({ id, password }: LoginArguments): void => {
  console.log(id);
  console.log(password);
  console.log('개쩌네요');
};

login({ id: 1, password: '123' });

이렇게 작성해줄 수 있습니다.

---

😲두개를 혼합해서 사용할 수도 있습니다.

interface GreetProp {
  id: number;
  [key: string]: any;
}
interface Greet {
  (obj: GreetProp): boolean;
}

const um: Greet = (obj: GreetProp) => {
  console.log(obj);
  return true;
};

const obj: GreetProp = {
  id: 1,
  hdsai: 2,
  dj: 3,
};

um(obj);

---

😦이걸 제네릭과 곁들여서 써보면?

interface GreetProp<T> {
  id: T;
  [key: string]: any;
}

interface Greet<T> {
  (obj: GreetProp<T>): boolean;
}

const um: Greet<number> = (obj: GreetProp<number>) => {
  console.log(obj);
  return true;
};

const obj: GreetProp<string> = {
  id: "foo",
  hdsai: 2,
  dj: 3
};

um(obj);

아하!