티스토리 뷰

728x90
반응형
계산된 프로퍼티 (Computed property)
객체의 key 를 변수로 사용할 수 있는 방식
식 자체가 들어가는 것도 가능
let key = "name";

const user = {
    [key] : 'Jake', // name : 'Jake'
    [1 + 2] : 3 // 3 : 3
}
Object.assign()
객체 복사 메서드
const user = {
	name : 'Jake'
}

const cloneUser = user;

일반적으로, 객체를 위 같이 복사하게 되면 객체 자체를 복사하는 것이 아니라 객체의 주소값을 같이 참조하게 된다.

같은 곳을 참고 하는 user 와 cloneUser

따라서, user 의 name 값을 변경하게 되면 cloneUser 의 name 값도 같이 변경되게 된다.

다른 주소값을 가지는 복제를 하려면 Object.assign() 메서드를 사용한다.

const user = {
	name : 'Jake'
}

const cloneUser = Object.assign({}, user);

이렇게 하게 되면, {} 빈 객체를 먼저 만들고 user 의 값을 할당하기 때문에 user 의 name 값이 변경 되어도 , cloneUser 의 name 값은 변경되지 않는다.

 

객체가 있을 경우 기존에 있는 객체에 더해서 복사하여 사용할 수 있다.

const user = {
	name : 'Jake'
}

const cloneUser = Object.assign({age : 30}, user);

만약, 키값이 중복되는 경우 user 객체의 값으로 덮어 씌운다.

 

또한,

const user = {
	name : 'Jake'
}

const info1 = {
	age : 30
}

const info2 = {
	gender : 'man'
}
Object.assign(user, info1, info2);

과 같이 여러개를 합쳐서 복사할 수 있다. 

Object.keys()
객체 키 배열 반환
Object.keys() 메서드는 객체 프로퍼티의 key 를 배열로 반환 한다.
const user = {
    name : 'jake',
    age : 30,
    gender : 'man'
}

const userKeys = Object.keys(user);
console.log(userKeys); // ['name', 'age', 'gender'] 출력
Object.values()
객체 값 배열 반환
Object.values() 메서드는 객체 프로퍼티의 value 를 배열로 반환 한다.
const user = {
    name : 'jake',
    age : 30,
    gender : 'man'
}

const userValues = Object.values(user);
console.log(userValues); // ['jake', 30, 'man'] 출력
Object.entries()
객체 키, 값 배열 반환
Object.entries() 메서드는 객체 프로퍼티의 key 와 value 값을 모두 배열로 반환 한다.
const user = {
    name : 'jake',
    age : 30,
    gender : 'man'
}

const userEntries = Object.entries(user);
console.log(userEntries); // [
                          //	  ['name', 'jake'],
                          //      ['age', 30],
                          //      ['gender', 'man']
                          // ]  출력
Object.fromEntries()
배열 키, 값 객체 반환
Object.fromEntries() 메서드는 배열 을 객체의 key 와 value 로 반환 한다.
const userArray = 
[
    ['name', 'jake'],
    ['age', 30],
    ['gender', 'man']
];

const userFromEntries = Object.fromEntries(userArray);
console.log(userFromEntries);
//{
//    name : 'jake',
//    age : 30,
//    gender : 'man'
//}  출력
728x90
댓글
반응형
250x250
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2026/01   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
글 보관함