타입스크립트에서 객체를 "더 안전하게" 순회하는 방법 (feat: 무공변성)

Copy 
1type Person = {
2  name: string;
3  age: number;
4  id: number;
5};
6
7declare const me: Person;
8
9Object.keys(me).forEach((key) => {
10  // No index signature with a parameter of type 'string' was found on type 'Person'.(7053)
11  console.log(me[key]);
12});

Copy 
1interface ObjectConstructor {
2  //...
3  keys(o: object): string[];
4  keys(o: {}): string[];
5}

Copy 
1interface ObjectConstructor {
2  // ...
3  keys<O extends object>(o: O): (keyof O)[];
4}

Copy 
1interface AB {
2  a: string;
3  b: string;
4}
5
6function someFunction(arg: AB) {
7  // 만약 Object.keys가 string[]이 아니라 (keyof AB)[] 타입을 리턴한다면 ...
8  return Object.keys(arg) as (keyof AB)[];
9}
10
11const myArgument = {
12  a: 'some',
13  b: 'thing',
14  c: 'unexpected',
15};
16
17// myArgument는 매개변수 타입 AB에 호환된다.
18// 따라서, 실제로는 ('a' | 'b' | 'c')[]이 리턴될 것이고, (keyof AB)[] 타입은 오류라는 것을 알 수 있다.
19someFunction(myArgument);

Copy 
1interface SuperType {
2  foo: number;
3}
4
5interface BaseType extends SuperType {
6  bar: string;
7}
8
9interface SubType extends BaseType {
10  baz: boolean;
11}
12
13declare let superTypeValue: SuperType;
14declare let baseTypeValue: BaseType;
15declare let subTypeValue: SubType;
16
17// 공변 (타입스크립트에서 변수는 공변이다.)
18baseTypeValue = superTypeValue; // 에러!
19baseTypeValue = subTypeValue; // 허용
20
21// 반공변 (타입스크립트에서 함수의 매개변수는 반공변이다.)
22baseTypeValue = superTypeValue; // 허용
23baseTypeValue = subTypeValue; // 에러!
24
25// 무공변
26baseTypeValue = superTypeValue; // 에러!
27baseTypeValue = subTypeValue; // 에러!
28
29// 이변
30baseTypeValue = superTypeValue; // 허용
31baseTypeValue = subTypeValue; // 허용

Copy 
1declare const tag: unique symbol;
2
3declare type Tagged<Token> = {
4  readonly [tag]: Token;
5};
6
7export type Opaque<Type, Token = unknown> = Type & Tagged<Token>;

Copy 
1interface SuperType {
2  foo: number;
3}
4
5interface BaseType extends SuperType {
6  bar: string;
7}
8
9interface SubType extends BaseType {
10  baz: boolean;
11}
12
13declare let superTypeValue: Opaque<SuperType, 'SuperType'>;
14declare let baseTypeValue: Opaque<BaseType, 'BaseType'>;
15declare let subTypeValue: Opaque<SubType, 'SubType'>;
16
17baseTypeValue = superTypeValue; // 에러!
18baseTypeValue = subTypeValue; // 에러!
19
20// 명목적 타입으로 만들어주는 브랜드 함수
21function createBaseType(base: BaseType): Opaque<BaseType, 'BaseType'> {
22  return base as Opaque<BaseType, 'BaseType'>;
23}
24
25baseTypeValue = createBaseType({foo: 123, bar: 'hello'});

Copy 
1interface AB {
2  a: string;
3  b: string;
4}
5
6type NominalAB = Opaque<AB, 'AB'>;
7
8// 명목적 타입으로 만들어주는 브랜드 함수
9function createAB(ab: AB): NominalAB {
10  return ab as NominalAB;
11}
12
13function getKeysOfAB(arg: NominalAB): (keyof AB)[] {
14  return Object.keys(arg) as (keyof AB)[];
15}
16
17const invalidArgument = {
18  a: 'some',
19  b: 'thing',
20  c: 'unexpected',
21};
22
23const validArgument = createAB({
24  a: 'some',
25  b: 'thing',
26});
27
28let keys: (keyof AB)[];
29
30keys = getKeysOfAB(invalidArgument); // 에러!
31keys = getKeysOfAB(validArgument);

Copy 
1function createAB(ab: AB): NominalAB {
2  return ab as NominalAB;
3}
4
5interface ABC extends AB {
6  c: boolean;
7}
8
9declare const abc: ABC;
10
11createAB(abc); // Okay... But...

Copy 
1declare const tag: unique symbol;
2
3declare type Tagged<Token> = {
4  readonly [tag]: Token;
5};
6
7export type Opaque<Type, Token = unknown> = Type & Tagged<Token>;
8
9export type InvariantOf<O extends object> = Opaque<O, keyof O>;

Copy 
1interface SuperType {
2  foo: number;
3}
4
5interface BaseType extends SuperType {
6  bar: string;
7}
8
9interface SubType extends BaseType {
10  baz: boolean;
11}
12
13declare let superTypeValue: InvariantOf<SuperType>;
14declare let baseTypeValue: InvariantOf<BaseType>;
15declare let subTypeValue: InvariantOf<SubType>;
16
17baseTypeValue = superTypeValue; // 에러!
18baseTypeValue = subTypeValue; // 에러!
19
20// 무공변 타입으로 만들어주는 함수
21function invariantOf<O extends object>(base: O): InvariantOf<O> {
22  return base as InvariantOf<O>;
23}
24
25baseTypeValue = invariantOf({foo: 123, bar: 'hello'});

Copy 
1declare const tag: unique symbol;
2
3declare type InvariantProperty<Type> = (arg: Type) => Type;
4
5declare type InvariantSignature<Type> = {
6  readonly [tag]: InvariantProperty<Type>;
7};
8
9export type InvariantOf<Type> = Type & InvariantSignature<Type>;

Copy 
1declare const valueAsNumber: InvariantOf2<number>;
2declare const valueAs1: InvariantOf2<1>;
3
4valueAsNumber = valueAs1; // 에러!
5valueAs1 = valueAsNumber; // 에러!
6
7declare const valueAsStringOrNumber: InvariantOf2<string | number>;
8declare const valueAsString: InvariantOf2<string>;
9
10valueAsStringOrNumber = valueAsString; // 에러!
11valueAsString = valueAsStringOrNumber; // 에러!

Copy 
1interface AB {
2  a: string;
3  b: string;
4}
5
6// 무공변적 타입으로 만들어주는 함수
7export function invariantOf<Type>(value: Type): InvariantOf<Type> {
8  return value as InvariantOf<Type>;
9}
10
11function getKeysOfAB(arg: Invariant<AB>): (keyof AB)[] {
12  return Object.keys(arg) as (keyof AB)[];
13}
14
15const invalidArgument = {
16  a: 'some',
17  b: 'thing',
18  c: 'unexpected',
19};
20
21const validArgument = createAB({
22  a: 'some',
23  b: 'thing',
24});
25
26let keys: (keyof AB)[];
27
28keys = getKeysOfAB(invalidArgument); // 에러!
29keys = getKeysOfAB(validArgument);

Copy 
1declare global {
2  export interface ObjectConstructor {
3    getOwnPropertyNames<T extends object>(o: InvariantOf<T>): Array<keyof T>;
4
5    keys<T extends object>(o: InvariantOf<T>): Array<keyof T>;
6
7    entries<T extends object>(o: InvariantOf<T>): Array<[keyof T, T[keyof T]]>;
8  }
9}

Copy 
1interface AB {
2  a: string;
3  b: string;
4}
5
6declare const ab: AB;
7
8Object.keys(ab); // string[]
9Object.keys(invariantOf(ab)); // (keyof AB)[]