studye / typescript

타입스크립트는 자바스크립트랑 다른 언어인가요?
7 stars 0 forks source link

[typescript - 2.1] keyof and Lookup Types #25

Open denzels opened 7 years ago

denzels commented 7 years ago

keyof index type query

객체의 속성을 추출하여 type 으로 정의해주는 놈.

interface Person {
    name: string;
    age: number;
    location: string;
}

// name, age, location 값만 가질 수 있는 새로운 타임 정의
type K1 = keyof Person; // "name" | "age" | "location"
// 배열의 속성을 추출... 
type K2 = keyof Person[];  // "length" | "push" | "pop" | "concat" | ...
// 응??
type K3 = keyof { [x: string]: Person };  // string

객체 프로퍼티의 type을 추출하여 새로운 type 을 만들 수 도 있음. ( lookup type or indexed access type )

// string type의 새로운 type을 정의 
type P1 = Person["name"];

// Person["name"]의 반환을 어디에 하느냐에 따라 값을 반환하는 지 type을 반환하는지가 결정 됨.

type P1 = Person["name"];  // string
type P2 = Person["name" | "age"];  // string | number
type P3 = string["charAt"];  // (pos: number) => string

// ????????
type P4 = string[]["push"];  // (...items: string[]) => number
type P5 = string[][0];  // string

이 두 가지를 조합하면 다음과 같은 함수 정의가 가능함.

function getProperty<T, K extends keyof T>(obj: T, key: K) {
    return obj[key];  // Inferred type is T[K]
}

function setProperty<T, K extends keyof T>(obj: T, key: K, value: T[K]) {
    obj[key] = value;
}

let x = { foo: 10, bar: "hello!" };

let foo = getProperty(x, "foo"); // number
let bar = getProperty(x, "bar"); // string

let oops = getProperty(x, "wargarbl"); // Error! "wargarbl" is not "foo" | "bar"

setProperty(x, "foo", "string"); // Error!, string expected number

참고