본문 바로가기
핀테크 서비스 프론트엔드 개발자 취업 완성 2기/JS

[JS] 데이터 - 객체 Object

by flyda 2022. 4. 26.

객체


Object.assign()

정적 메서드이다. 그래서 객체에 직접 못사용함!!
Object.assign() 메서드는 출처(source) 객체들의 모든 열거 가능한 자체 속성을 복사해 대상(target) 객체에 붙여 넣는다. 그 후 대상 객체를 반환한다.

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);
// expected output: Object { a: 1, b: 4, c: 5 }

console.log(returnedTarget);
// expected output: Object { a: 1, b: 4, c: 5 }

사용법 : Object.assign(target, source1, sources2, sources3,....)

const userAge = {
  name: 'flyda',
  age: 85
}
const userEmail = {
  name: 'flyda',
  email: 'dlapdlf@gamil.com'
}

const target = Object.assign(userAge, userEmail)
console.log(target)// {age: 85,  email: "dlapdlf@gamil.com",  name: "flyda"}
console.log(userAge)// {age: 85,  email: "dlapdlf@gamil.com",  name: "flyda"}
console.log(target === userAge)//true 

const a = { k: 123 }
const b = { k: 123 }

console.log(a === b)//false

생긴 것이 같아서 true가 아님!! 객체는 참조형데이터인데, 이름이 달라도 같은 메모리 주소를 참조하고 있기 때문에 true!!!

참조형 데이터 : 객체, 배열, 함수

만약 두 객체를 합쳐서 원본 수정없이 새로운 객체를 만들고 싶다면!!

const userAge = {
  name: 'flyda',
  age: 85
}
const userEmail = {
  name: 'flyda',
  email: 'dlapdlf@gamil.com'
}

const target = Object.assign({},userAge, userEmail)
console.log(target)// {age: 85,  email: "dlapdlf@gamil.com",  name: "flyda"}
console.log(userAge)// {age: 85,  name: "flyda"}
console.log(target === userAge)//false

앞에 빈 배열이 들어갔기 때문에 더이상 userAge는 대상객체가 아니라 출처 객체가 된다!!

const userAge = {
  name: 'flyda',
  age: 85
}

const target = Object.assign({},userAge) // 원본 데이터를 보존하면서 복사 하는 용도로도 사용가능!
console.log(target)// {age: 85,  name: "flyda"}
console.log(userAge)// {age: 85,  name: "flyda"}
console.log(target === userAge)//false

.keys

객체의 key를 새로운 배열로 반환

const user= {
  name: 'flyda',
  age: 85,
  email: 'dlapdlf@gamil.com'
}

const keys = Object.keys(user)
console.log(keys)//['name', 'age', 'email']

//객체 indexing 방법 property의 이름으로 인덱싱가능
console.log(user['email'])//dlapdlf@gamil.com

const values = keys.map(key => user[key])
console.log(values)//['flyda', 85, 'dlapdlf@gamil.com']

댓글