TS(타입 연습해보기)

 

타입 추론하기

interface Arr<T> {
  forEach(callback: (item: T) => void): void;
}

const a: Arr<number> = [1, 2, 3];
a.forEach((item) => {
  console.log(item);
  item.toFixed(1);
});

a.forEach((item) => {
  console.log(item);
  return "3";
});

const b: Arr<string> = ["1", "2", "3"];

b.forEach((item) => {
  console.log(item);
  item.charAt(3);
});

b.forEach((item) => {
  console.log(item);
  return "3";
});

 

 

타입 직접 하나씩 만들어보기

interface Arr<T> {
  forEach(callback: (item: T) => void): void;
  map(callback: (v) => void): void;
}

const a: Arr<number> = [1, 2, 3];
const b = a.map((v) => v + 1);

이것을 오류 안나게 변경하면 

interface Arr<T> {
  forEach(callback: (item: T) => void): void;
  map(callback: (v: T) => T): T[];
}

const a: Arr<number> = [1, 2, 3];
const b = a.map((v) => v + 1); //[2,3,4]

 

다른 예시

interface Arr<T> {
  forEach(callback: (item: T) => void): void;
  map<S>(callback: (v: T) => S): S[];
}

const a: Arr<number> = [1, 2, 3];
const b = a.map((v) => v + 1); //[2,3,4]
const c = a.map((v) => v.toString());//['2','3','4']; string[]

interface Arr<T> {
  forEach(callback: (item: T) => void): void;
  map<S>(callback: (v: T) => S): S[];
  filter<S extends T>(callback: (v: T) => v is S): S[];
}

const a: Arr<number> = [1, 2, 3];

const b = a.filter((v): v is number => v % 2 === 0); //[2]

const c: Arr<number | string> = [1, "2", 3, "4", 5];
const d = c.filter((v): v is string => typeof v === "string"); //['2','4'] stinrg[]

 

이렇게 예시를 하나씩 작성해보면서 타입을 직접 넣어봐야한다.