본문 바로가기

Language/Javascript

[Javascript] 계산된 프로퍼티(Computed property), 객체 메소드(Object methods)

728x90
반응형

계산된 프로퍼티(Computed property)

[] 을 이용해서 객체의 변수명에 미리 계산된 변수를 넣는 것이 가능하다.

let a = 'age';

const user = {
    name : 'Mike',
    [a] : 30   // age : 30
}

식 자체가 들어가는 것도 가능하다.

const user = {
    [1 + 4] : 5,     // 5 : 5
    ["안녕"+"하세요"] : "Hello"    // 안녕하세요 : "Hello"
}

 

객체 메소드(Object methods)

Object.assign() : 객체 복제

const user = {
    name : 'Mike',
    age : 30,
}

// const cloneUser = user;
const newUser1 = Object.assign({}, user);   // name : 'Mike', age : 30
const newUser2 = Object.assign({ gender:'male' }, user);    // name : 'Mike', age : 30, gender : 'male'
const newUser3 = Object.assign({ name:'Tom' }, user);    // name : 'Tom', age : 30

cloneUser에 user을 넣을 경우 하나의 객체를 두 변수가 접근하고 있는 것이다. 따라서 user.name을 바꿀 경우 cloneUser.name도 바뀐다.

복제하려면 Object.assign 메소드를 써야 한다. 이 때 {}은 초기값이다. 두 번째 매개변수부터 들어온 객체들이 초기값에 병합된다. 키가 같다면 초기값이 기존값을 덮어쓰게 된다.

const user = {
    name : 'Mike',
}
const info1 = {
    age : 30,
}
const info2 = {
    gender : 'male',
}

Object.assign(user, info1, info2)   // name : 'Mike', age : 30, gender : 'male'

2개 이상의 객체도 합칠 수 있다.

 

Object.keys() : 키 배열 반환

const user = {
    name : 'Mike',
    age : 30,
    gender : 'male'
}

Object.keys(user);   // ["name", "age", "gender"]

 

Object.values() : 값 배열 반환

const user = {
    name : 'Mike',
    age : 30,
    gender : 'male',
}

Object.values(user);  // ["Mike", 30, "male"]

 

Object.entries() : 키/값 배열 반환

const user = {
    name : 'Mike',
    age : 30,
    gender : 'male',
}

Object.entries(user);   // [["name", "Mike"], ["age", 30], ["gender", "male"]

 

Object.fromEntries() : 키/값 배열을 객체로

const arr = [["name", "Mike"], ["age", 30], ["gender", "male"]];

Object.fromEntries(arr);    // { name : 'Mike', age : 30, gender : 'male', }
728x90
반응형