객체의 구조분해할당의 경우 "key" 이름이 중요하다.
객체의 구조분해할당의 경우 순서는 중요하지 않다.
const profile = {
name: "영희",
age : 7,
school : "토끼초등학교"
}
const { age } = profile ★age: 키
console.log(age, school, name)
<출력결과>
7, "토끼초등학교" , 영희
배열의 구조분해할당의 경우 "순서"가 중요하다.
const classmates = ["철수", "영희", "훈이", "맹구"]
const [ child1, child3 ] = classmates
console.log(child1, child3)
<출력결과>
"철수", "영희"
얕은 복사(통상적인 그대로)
let aaa ="철수"
let bbb = aaa
console.log(bbb)
<출력결과>
철수
bbb="영희"
console.log(bbb)
<출력결과>
영희
console.log(aaa)
<출력결과>
철수
객체나 배열의 경우 얕은 복사의 한계
let profile = {
name : "철수",
age : 13,
school: "다람쥐초등학교"
}
let profile2 = profile
console.log(profile2)
<출력결과>
{ name: '철수', age: 13, school: '다람쥐초등학교' }
console.log(profile)
<출력결과>
{ name: '철수', age: 13, school: '다람쥐초등학교' }
-------------------------------------------------------
profile2.name = "영희"
console.log(profile2)
<출력결과>
{ name: '영희', age: 13, school: '다람쥐초등학교' }
console.log(profile)
<출력결과>
{ name: '영희', age: 13, school: '다람쥐초등학교' } badCase
---------------------------------------------------------
copy본(profile2)을 수정하는 경우에 원본(profile)이 영향받는 이유: 주소(번지)가 복사되었기 때문이다.
const person = { name: "철수" }
person = 123 (X) 상수이므로
person.name = "영희" (O) 내부 내용물을 바꿀수 있다.
person객체 안의 내부도 변경하지 못하게 하고 싶은 경우
const person = Object.freeze( { name: "철수"} )
spread
let profile3 = { ...profile }
{ } 별도의 새로운 객체를 만들고, 그 안에 내용을 흩뿌린다(spread)
하지만 "완벽한 복사"라고 볼 수 없다.
spread(얕은 복사)의 한계
let profile = {
name : "철수",
age : 13,
school: "다람쥐초등학교",
hobby: {
hobby1: "수영하기",
hobby2: "게임하기"
}
}
let profile2 = {
name : profile.name,
age : profile.age,
school: profile.school,
hobby: profile.hobby
}
let profile3 = { ...profile }
profile2.hobby.hobby1 = "독서하기"
console.log(profile2)
name: '철수', age: 13, school: '다람쥐초등학교', hobby: {…}}
age: 13
hobby: {hobby1: '독서하기', hobby2: '게임하기'}
console.log(profile) -> badcase발생!!!!
name: '철수', age: 13, school: '다람쥐초등학교', hobby: {…}}
age: 13
hobby: {hobby1: '독서하기', hobby2: '게임하기'}
copy본(profile2)을 수정하는 경우에 원본(profile)이 영향받는 이유: 객체 안에 있는 hobby주소(번지)가 복사되었기 때문이다.
let profile = {
name : "철수",
age : 13,
school: "다람쥐초등학교",
hobby: {
hobby1: "수영하기",
hobby2: "게임하기"
}
}
깊은 복사(해결방안) -객체, 배열에 사용
let tmp = JSON.stringify(profile)
profile객체가 문자열(String)타입으로 변환된다.
let profile2 = JSON.parse(tmp)
문자열(String)로부터 새로운 객체 profile2를 만든다.
두 배열을 합치고 싶은 경우 (매우 유용)
const a = ["철수", "영희", "훈이" ]
const b = ["맹구", "짱구" ]
const c = [ ...a, ...b ]
console.log(c)
[ "철수", "영희", "훈이", "맹구", "짱구" ]
REST 파라미터
const child = {
name: "철수"
age: 8,
school: "다람쥐초등학교",
money: 2000,
hobby: "수영",
}
const { money, hobby, ...rest } = child
console.log(rest)
{ name: "철수", age: 8, school: '다람줘초등학교' }