3. 객체 메소드

조뮁·2022년 7월 10일
0

JS중급

목록 보기
3/18
post-thumbnail

객체 메소드

Object.assign() :객체 복제

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

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

console.log(cloneUser);

/*
{
	name : 'Mike',
    age : 30
}
*/

// cloneUser의 name을 변경해도 기존 user.name은 바뀌지 않음
cloneUser.name = "Jane";

console.log(user);
console.log(cloneUser);
  • user 변수에는 객체 자체가 아니라, 객체가 저장되어 있는 메모리 주소인 객체에 대한 참조값만 존재함. cloneUser에는 참조값만 복사됨. 하나의 객체를 두 변수가 공유하는 것.

  • 동일하게 복제하기 위해서는
    object.assign(초기값, 복사할 객체) 사용해야함.

// Object.assign() 초기값 설정
const user = {
  name : "Mike",
  age : 30,
}

let user2 = Object.assign({gender: 'm'}, user);

console.log(user2);

/*
const user = {
  gender : 'm',
  name : "Mike",
  age : 30,
}
*/
  • 초기값 gender:'m'을 가지고 있던 객체가 user을 복사하게됨.
  • 병합 시 key값이 같다면 복사해오는 값이 덮어씀.
const user = {
  name : 'Mike',
}

const info1 = {
  age : 30,
}

const info2 = {
  gender : 'm',
}


let user2 = Object.assign(user, info1, info2);
// user에 info1 과 info2 객체를 병합함.

console.log(user2);

/*
{
	age: 30
	gender: "m"
	name: "Mike"
}
*/

Object.keys() : 키 배열 반환

  • 객체 프로퍼티의 키를 배열로 반환함
const user = {
 	name : 'Mike',
    age : 30,
    gender: 'm',
}

Object.keys(user);

// ['name', 'age', 'gender']

Object.values() : 값 배열 반환

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

Object.values(user);
// ['Mike', 30, 'm']

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

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

Object.entries(user);

/*
[
	['name', 'Mike']
	['age', 30]
	['gender', 'm']
]
*/
  • 키와 값을 쌍으로 묶어서 배열로 반환해줌
  • 배열 안에 [key, val] 배열이 있음

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

const arr = [
	['name', 'Mike'],
	['age', 30],
	['gender', 'm']
]

Object.fromEntries(arr);

// {name: 'Mike', age: 30, gender: 'm'}

Computed property []

let a = 'age';

const use = {
  name : 'Mike',
  [a] : 30,  // age : 30
}
  • 프로퍼티에 [a]를 넣어주면, 변수 a에 할당된 값이 들어가게 됨.
  • []에 식 자체를 넣는 것도 가능
const user = {
  [1+4] : 5,
  ["안녕"+'하세요'] : "hello",
}

console.log(user);

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

console.log(user);
*/

어떤 키와 값이 들어올지 모르는 객체를 만들 때 사용 가능.

function makeObj(key, val){
  return {
    [key]: val,
  }
}

const obj = makeObj('나이', 33);

console.log(obj);

// { "나이": 33 }

0개의 댓글