Typescript 시리즈 - 배열에 유형 포함

나는 더 나은 Typescript를 배우고 이해하기 위해 이 시리즈를 하고 있다고 말하면서 시작하고 싶습니다. 그러니 자유롭게 저를 수정하거나 저에게 연락하십시오.

유형 시스템에서 JavaScript Array.includes 함수에 대한 유형을 작성해 보겠습니다. 유형은 두 개의 인수를 사용합니다. 출력은 부울 true 또는 false여야 합니다.

JavaScript Array.includes 함수는 다음과 같습니다.

const arr = ["a","b","c"]:
arr.includes("a") // true

그리고 우리의 타입은 다음과 같아야 합니다:

<Includes<[1, 2, 3, 5, 6, 7], 7> // true
<Includes<[1, 2, 3, 5, 6, 7], 4> // false

그래서 우리는 무엇을 압니까?

유형이 배열과 값을 입력으로 받아야 한다는 것을 알고 있습니다.

배열에 원하는 값이 있는지 확인해야 합니다

.

배열의 모든 요소를 ​​확인한 후 그에 따라 부울을 반환합니다.

type Includes<TArray extends readonly unknown[], Value> = 
TArray extends [infer FIRST,... infer REST] ? 
Equal<Value,FIRST> extends true ? true : Includes<REST,Value> : false

이 유형의 경우 두 입력이 동일한지 확인하는 Equal 유틸리티 유형이 필요합니다.
TArray extends readonly unknown[] 먼저 TArray 유형이 배열인지 확인합니다.

추론 키워드 이해
infer 키워드는 유추된 유형을 변수에 넣기 위해 조건부 유형의 조건 내에서 사용할 수 있습니다. 그 추론된 변수는 조건 분기 내에서 사용될 수 있습니다.
TArray extends [infer FIRST,... infer REST] 배열의 첫 번째 요소를 추론한 다음 나머지 요소를 추론합니다.
Equal<Value,FIRST> extends true 첫 번째 요소가 원하는 값과 같은지 확인합니다. 그렇다면 원하는 값을 얻은 것이므로 true를 반환해야 합니다. 그렇지 않으면 나머지 요소를 재귀적으로 다시 확인합니다: Includes<REST,Value>.

마지막으로 배열에서 요소를 찾을 수 없는 경우 false를 반환합니다: false.

이것은 어려운 작업이었지만 포함 기능이 내부에서 어떻게 작동하는지 배웠습니다.

고맙습니다!

당신은 여기에서 나를 찾을 수 있습니다