유형스크립트 키-값 관계를 보존하는 Object.entries 유형

유형스크립트 키-값 관계를 보존하는 Object.entries 유형

typescript에서 제공하는 type은 리턴 타입이 있지만 키와 값의 관계를 유지하는 이 함수의 리턴 값을 나타내는 제네릭 타입을 찾고 있습니다.

예를 들어, 다음과 같은 객체 유형이 있는 경우

type Obj = {
    a: number,
    b: string,
    c: number
}

다음과 같이 제공되면 아래 유형 중 하나(또는 유사한 유형)가 발생하는 유형을 찾고 있습니다.

(["a", number] | ["b", string] | ["c", number])[]
[["a", number], ["b", string], ["c", number]]
(["a" | "c", number] | ["b", string])[]

---

Object.entries()의 모든 사용 사례에 대해 이것이 정확하지 않다는 것은 제 특정 사례에서 문제가 되지 않습니다.

---

시도되었지만 실패한 솔루션:

는 가능한 키와 값만 보존할 뿐 이들 사이의 관계는 그대로 보존하지 않으므로 이 경우에는 작동하지 않습니다.

type Entry<O, K extends keyof O> = [K, O[K]]
type Entries<O> = Entry<O, keyof O>[]

여기서 예상한 대로 작업의 정의는 두 번째 유형 변수로서 두 번째 줄에 적용하면 첫 번째 시도와 동일한 결과가 됩니다.

---

다음은 해결 방법이지만, 이 방법을 의 반환 유형으로 사용할 경우, 항상 안전한 것은 아닙니다(아래 참조).

---

각 키를 해당 키의 유형에 따라 다른 키와 쌍으로 구성하려면 다음을 사용하십시오.

type Entries<T> = {
    [K in keyof T]: [K, T[K]];
}[keyof T][];

type Test = Entries<Obj>;
// (["a", number] | ["b", string] | ["c", number])[]

유니온 대신 속성을 포함하는 튜플 유형을 가진 두 번째 버전은 구성하기가 훨씬 어렵습니다. 하지만 기본적으로는 그렇게 해서는 안 됩니다.

세 번째 버전은 관리할 수 있지만 첫 번째 버전보다 조금 더 복잡합니다. 에서 사용해야 합니다.

type Entries3<T> = {
    [K in keyof T]: [keyof PickByValue<T, T[K]>, T[K]]
}[keyof T][];

type Test3 = Entries3<Obj>;
// (["a" | "c", number] | ["b", string])[]

놀이터 링크

---

Typescript가 에 더 강한 유형을 부여하는 이유도 설명해야 할 것 같습니다. 와 같은 유형이 있는 경우 값에 이러한 속성이 있다는 것만 보장되며, 값에 다른 속성이 없다는 것도 보장됩니다. 예를 들어, 값은 유형에 할당할 수 있습니다(객체 리터럴에 대한 초과 속성 확인).

이 경우 요소를 포함하는 배열을 반환합니다. 타입은 이것이 일어날 수 없다고 말하지만, 사실 그것은 일어난다; 일반적인 것에 대한 사운드 리턴 타입은 아니다. 값이 초과 속성을 갖지 않는다는 것을 스스로 알고 있을 때만 위의 솔루션을 사용해야 합니다. 형식 스크립트는 이 항목을 확인하지 않습니다.

---

다음과 같은 전용 기능을 만들 수 있습니다.

depictObjectKeyType<O>(o: O) {
    return Object.keys(o) as (keyof O)[];
}

depictEntriesKeyType<T>(obj: T): Entries<T> {
    return Object.entries(obj) as any;
}

그리고 다음을 사용합니다.

this.depictEntriesKeyType(data).forEach(....

---

현재 다음과 같은 형태로 이 기능을 포함하기 위해 이 유틸리티 라이브러리가 소개되었습니다.

import { Entries } from 'type-fest';

Object.entries(obj) as Entries<typeof obj>;

---

Peter Cardenas의 답변에 따라, 나는 도우미 기능도 만들었다.

const getEntries = <T extends object>(obj: T) => Object.entries(obj) as Entries<T>;