HooneyLog

간단하고 빠르게 객체 데이터 업데이트 하는 방법

프로필 이미지

Seunghoon Shin

2022년 5월 20일 15:34

업데이트 해볼 객체

type AccountKey = 'id' | 'pwd' | 'nickname';

let myAccount:Record<AccountKey, string> = {
    id:'hooney',
    pwd:'1234aa',
    nickname:'hoon'
}

하나의 임시 계정 데이터를 지닌 객체에서 nickname만 업데이트를 하려고 한다

방법

const dataForUpdating:Pick<Record<AccountKey, string>,'nickname'> = {
    nickname:'후니'
}

// {
//  "id": "hooney",
//  "pwd": "1234aa",
//  "nickname": "후니"
// }
myAccount = {
    ...myAccount,
    ...dataForUpdating
}

  • 업데이트를 치고 싶은 키와 밸류를 넣은 객체를 만든다
  • spread 기법을 사용하여 새롭게 객체를 다시 만들어준다
  • 추가 사항

    type AccountKey = 'id' | 'pwd' | 'nickname';
    Record<AccountKey, string>
    
    ---------------
    
    interface AccountKey {
    	id:string;
    	pwd:string;
    	nickname:string
    }

    Record<AccountKey, string> 와 interface AccountKey 은 같다고 보면 된다.

    첫번째는 유니온 타입을 활용하여 객체의 타입을 Record를 사용하여 string value 타입을 가진 형태로 간단하게 만든 것이다.

    Pick<Record<AccountKey, string>,'nickname'>

    여기서 Pick은 해당 타입에서 nickname이라는 키 만 사용하겠다는 뜻이다.