JavaScript { ... } 문법

 

 

let a = {name:"minjae", age:27}

let b = {...a}
let c = a

console.log(b) // {name:"minjae", age:27}
console.log(c) // {name:"minjae", age:27}

위 코드를 보면 b와 c의 콘솔 결과 값은 같은 것을 확인할 수 있지만 차이점은 분명하다.

 

b와 c의 차이점은 무엇일까?

 

b는 a을 복사할 때 새로운 객체를 생성하여, 생성된 객체의 주소를 바라보게되고

c은 a 객체의 주소를 바라보도록 한다.

 

 

따라서 아래와 같은 결과가 나온다.

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

 

---

 

값 추가

let a = {name:"minjae", age:27}

let b = {...a, address:"suwon"}

console.log(b) // {name:"minjae", age:27 address:"suwon"}

let arr1 = [1, 2, 3]
let arr2 = [...arr1, 4, 5]

console.log(arr2) // [1, 2, 3, 4, 5]

let arr3 = [...arr1, ...arr2]

console.log(arr3) // [1, 2, 3, 1, 2, 3, 4, 5]

 

 

---

 

 

값 변경

let a = {name:"minjae", age:27}

let b = {...a, age:25}

console.log(b) // {name:"minjae", age:25}

 

 

---

 

 

반복문

let arr1 = [1, 2, 3]
let arr2 = [...arr1, 4, 5]
let arr3 = [...arr1, ...arr2]

arr3.forEach(item => console.log(item));
/*
1
2
3
1
2
3
4
5
*/