(JS) 배열의 중복 값 개수 구하기

forEach()

const arr = ['a', 'b', 'a', 'b', 'c'];

const result = {};
arr.forEach((x) => { 
  result[x] = (result[x] || 0)+1; 
});

document.write(JSON.stringify(result));
// {"a":2, "b":2, "c": 1}

const result = {};

중복된 값의 갯수를 저장하기 위한 Object를 선언한다.

arrforEach(callback 함수);

배열(arr)의 각각의 원소드을 순서대로 callback 함수에 전달해 실행합니다.

result[x] = (result[x] || 0) + 1;
// 이 코드를 좀 더 풀어쓰면 아래와 같다.
if(result[x]) {
  result[x] = result[x]+1;
} else {
  result[x] = 0 + 1;
}

처음에 배열의 첫번째 값 'a'가 입력되면,
result[x], 즉 result.a는 undefined입니다.
result.a가 undefined이므로
result에 a 속성을 추가하고, 1을 세팅합니다.

배열의 두번째 값'b'가 입력되도 마찬가지로,
result에 b속성을 추가하고, 1을 세팅합니다.

배열의 세번째 값'a'가 입력되면,
이번에는 result.a의 값이 1로 세팅되어 있으므로,
result.a의 값을 result.a + 1 즉 2로 세팅합니다.

객체의 속성명을 동적으로 추가하기 위해
점표기법(dot notaition) 대신에 대괄호 표기법(square bracket notation)을 사용

reduce()

const arr = ['a', 'b', 'a', 'b', 'c'];

const result = arr.reduce((acc, cur) => {
  acc[cur] = (acc[cur] || 0) + 1;
}, {});

document.write(JSON.stringify(result));
// {"a":2,"b":2,"c":1}

reduce() 함수는, 배열의 값을 순회하면서 배열의 값을 특정 형태로 누적하는데 사용된다.
배열(arr)의 각 element들에 대해서 파라미터로 입력받은 콜백 함수를 실행해 하나의 리턴값을 반환한다.

let value = arr.reduce(function(accumulator, currentValue, currentIndex, array) 

콜백함수는 배열(arr)의 모든 element를 대상으로 한번씩 호출된다.
따라서, reduce() 함수를 사용하면, 배열을 순차적으로 순회하면서 배열의 값을 누적하는데 유용하다.

Map 객체

const arr = ['a', 'b', 'a', 'b', 'c'];

const result = arr.reduce((acc, cur) => {
  acc.set(cur, (acc.get(cur) || 0) + 1);
  return acc;
}, new map());

for (let [key, value] of result.entries()) {
  document.write(key + ':'+ value + '<br>');
}

중복값 저장을 일반 객체가 아닌 Map 자료구조에 하도록 했다.
Map은 2번 예제에서 사용한 객체와 같이 key와 value를 저장하는 자료구조이다.

일반 객체와 다른 점은 Map은 객체를 key로 지정할 수 있다는 점이다.
Map 객체를 사용하면, 배열의 원소가 일반 문자열이나 숫자가 아닌 객체인 경우에도 key로 사용할 수 있다.