[F-Lab 모각코 챌린지 - 68일차] - 타입스크립트 forEach, map, filter, split

Big One·2023년 7월 17일
0

F-Lab

목록 보기
68/69

lib.es5.d.ts 분석하기

forEach, map, filter 타입을 분석하고 만들어보겠습니다. 모두 배열이므로 interface를 공통으로 사용하겠습니다.

interface

interface Arr<T>{
	// 앞으로 작성될 forEach, map, filter은 여기에 작성되는 코드입니다.
}
const array = [1, 2, '3', '4', true];

forEach

forEach(callback: (value: T, index: number, array: T[]) => void, thisArg?: any): void;

배열에 forEach 메서드를 콜백함수는 value, index, array 인자를 갖는데 index 는 값이 숫자이므로 타입은 number 입니다. array는 원본 배열이기 때문에 원본 배열의 타입을 T라 하였으니 T[] 가 되고 T[]이기 때문에 value 값의 타입은 T가 됩니다. 콜백함수 실행 후 반환해주는 것이 없으므로 타입은void 이고, forEach 메서드 실행 후 반환하는 것이 없으므로 반환 값의 타입은 void 입니다.

map

map<S>(callback: (value: T, index: number, array: T[]) => S, thisArg?: any): S[];

다른 타입은 forEach 와 갖고 콜백함수의 반환타입으로 S가 반환되는데 각 요소를 순회하면서 어떤 과정을 거쳐 어떤 반환값이 나올지 몰라 S 타입을 지정한 후 map 메서드 실행 후 콜백함수의 반환값들을 배열로 반환해주기 때문에 S[] 가 됩니다.

filter

filter<S extends T>(predicate: (value: T, index: number, array: T[]) => S, thisArg?: any): S[];

filter의 predicate 콜백함수는 map 메서드와 같고 filter는 원본 객체에서 특정한 것을 필터링 하는 것이기 때문에 반환 되는 값은 원본 객체안에 속해있습니다.. 고로 “S 타입은 T 타입에 제한되어있다.” 라고 할 수 있으므로 S extends T 를 설정하고 S를 반환 후 filter 메서드의 반환 값 타입은 S[] 입니다.

split

split(separator: string | RegExp, limit?: number): string[];

split 메서드는 반환 값으로 무조건 string 배열을 반환합니다. string[] 이 되고, 인자로 string 또는 정규식(RegExp) 를 인자로 받을 수 있으므로 타입은 string | RexExp 됩니다.

profile
이번생은 개발자

2개의 댓글

comment-user-thumbnail
2023년 7월 18일

가치 있는 정보 공유해주셔서 감사합니다.

답글 달기
comment-user-thumbnail
2023년 7월 18일

유익한 글 잘 봤습니다, 감사합니다.

답글 달기