객체
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']
'핀테크 서비스 프론트엔드 개발자 취업 완성 2기 > JS' 카테고리의 다른 글
[JS] regeneratorruntime is not defined 에러 해결 방법. (0) | 2022.05.02 |
---|---|
[JS] Lodash (_.) (0) | 2022.04.28 |
[JS] 데이터 - 구조 분해 할당 ( 객체, 배열) (0) | 2022.04.26 |
[JS] 데이터 - 전개 연산자 (0) | 2022.04.26 |
[JS] 데이터 - 데이터 불변성 (Immutability) (0) | 2022.04.26 |
댓글