같은 배열 요소 찾기 (forEach)

배열은 참조타입으로 안의 요소가 같더라도 참조하는 메모리가 다르기 때문에, 아무리 우리 눈에 똑같아 보일지라도 바로 비교할 경우, 무조건 false가 뜬다. 

var arr1 = [1, 2, 3];
var arr2 = [1, 2, 3];
console.log(arr1 === arr2); // output: false

반면 원시타입은 바로 값의 비교가 가능하다. 

var arr1 = "1";
var arr2 = "1";
console.log(arr1 === arr2); // output: true

(다른 글: 2020/02/07 - 원시타입, 참조타입 차이점)

 

따라서 배열의 각 요소(element)가 같은 값인지 직접적으로 비교해줘야 한다. 

우선 배열 안의 값을 비교하는 코드를 먼저 보자.

var arr1 = [1, 2, 3];
var arr2 = [3, 2, 1];

const finalArray = [];
function compare(arr1, arr2) {  
  arr1.forEach( (e1) => {arr2.forEach( (e2) => {
    if (e1 === e2) {
      finalArray.push(e1)
    }
  })})
  return finalArray;
}

compare(arr1, arr2) // output: [1, 2, 3]

 

배열.forEach()는 배열 요소 각각 메소드를 실행한다. 

어디서 많이 본 형태일 것이다. 바로 for문이다. 

 

우리가 많이 쓰는 for문 형태를 먼저 보자면 아래와 같다. 

const items = ['a', 'b', 'c'];
const copy = [];

for (let i=0; i<items.length; i++) {
  copy.push(items[i]);
}
console.log(copy); // output: ['a', 'b', 'c']

그리고 이를 forEach로 바꾸면 조금 더 간단하게 줄일 수 있다. 

const items = ['a', 'b', 'c'];
const copy = [];

items.forEach(function(item){
  copy.push(item);
});
console.log(copy); // output: ['a', 'b', 'c']

 

배열에서 같은 요소 찾는 것도 for문을 몇 번 돌려서 찾아낼 수 있겠지만, forEach를 중첩으로 돌리면 더 쉽게 해결 할 수 있다.