배열 합치기

예시

const data = [
  {id: 1, name: 'a'}, 
  {id: 2, name: 'b'}, 
  {id: 3, name: 'c'}, 
  {id: 4, name: 'd'}, 
  {id: 5, name: 'e'}
];

const data2 = [
  {id: 4, name: 'd'},
  {id: 6, name: 'new'},
];

data2 배열에 id가 중복되는 객체를 제외하고 data배열 합치기

🔹 원하는 결과

[
  {id: 1, name: 'a'}, 
  {id: 2, name: 'b'}, 
  {id: 3, name: 'c'}, 
  {id: 4, name: 'd'}, 
  {id: 5, name: 'e'},
  {id: 6, name: 'new'}, 
]

🔹 코드

const merged = [
  ...data, 
  ...data2.filter(item => !data.some(d2 => d2.id === item.id)) 
];

먼저 data 배열의 요소들을 그대로 포함시킨다
data2에서 data에 없는 요소들만 필터링하여 추가한다

some( ) 함수는 includes( )와 다르게 콜백함수를 매개변수고 사용할 수 있다❗
위의 코드는 배열의 요소들이 객체이기 때문에 some( ) 함수의 인자로 콜백함수를 전달해서 객체의 id 속성에 접근해야 한다 😊

만약 배열의 요소가 단순 값들이라면❓

const data = ['a', 'b', 'c', 'd', 'e'];
const data2 = ['d', 'new'];

const merged = [
  ...data, 
  ...data2.filter(item => !data.includes(item))
];

객체를 비교할 때는 id와 같은 속성을 확인하지만, 값 자체를 비교할 때는 값 비교만 하면 된다 😊
따라서 값만 비교해주는 includes( ) 함수 사용❗

🔹 결과

['a', 'b', 'c', 'd', 'e', 'new']