타입스크립트 타입 조작 - keyof와 typeof

keyof 연산자

📌객체 타입에 이용된다.

📌객체타입에 있는 모든 프로퍼티의 key들을 string literal union으로 추출해낸다.

 

예를들어 

type objKey = {

    name:string;

    age:number;

    position:string

}

이라는 타입의 프로퍼티는 세 개다.

 

각각의 프로퍼티 키 네임은 각각 name, age, position이고 타입을 따져보면 각각 name,age,position이라는 고유한 값을 가지는 string literal이다.

여기서 string literal union이라하면 name | age | position 이 된다.  

 

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

function getKey(person: Person,key: "name" | "age"){
	return person[key]
}

 

💫객체 접근방법

 

    let obj = {

        name:"사용자1"

    }

    - obj.name

    - obj["name"]

 

 

이런 코드를 짜면 역시나 타입의 프로퍼티가 추가or삭제or수정됐을 경우 하나하나 찾아다니며 수정해야하는 번거로움이 있다.

 

✔️keyof 타입명

function getKey(person: Person,key: keyof Person){
	return person[key]
}

 

이렇게 코드를 변경하면 Person 타입에 있는 모든 프로퍼티의 키 값들을 추출해 유니온타입으로 만들어준다.

 

keyof typeof 연산자

 

여기에서 typeof는 특정 변수의 타입을 추론해준다.

function getKey(person: Person,key: keyof typeof person){
	return person[key]
}

const person = {
	name:"고영이",
	age:22
}

getKey(person, "name") //고영이

 

person 객체의 타입을 추론해서 이 객체에 포함된 각각의 프로퍼티에 접근한다.