5월 26일 TIL - reduce()

자연수 n 의 자릿수를 모두 다 더하고 리턴해보기 알고리즘 문제를 풀다 막히고 해결한 것들. 

 

문제 접근 방식을

1. 입력받은 자연수의 길이만큼 반복문을 돌면서

2. 일의 자릿수 빼내오고

3. 일의 자릿수의 숫자를 날려서 십의 자릿수 이상의 숫자들을 자릿수 다운그레이드 시키기

로 세워보았다. 

 

function solution(n) {
  var answer = 0;
  while (n > 0) {
    answer = (n % 10) + answer;
    n /= 10;
  }

  return answer;
}

console.log(solution(2345));

2345의 자릿수를 다 더하는 코드를 만들어서 출력하니

이렇게 말도안되는 숫자가 나왔다..

알고보니 / 연산을 하면 몫만 출력이 된다고 착각을 했었다. % 연산자는 나머지만 뽑아내니까 /는 몫만 뽑아낸다고 생각했던듯,,,

몫만 뽑아내기 위해 구글링을 해보니 Math.floor() 메서드를 알아냈다

 

n = Math.floor(n / 10);

이렇게 바꿔주니 해결완

 

 

** 또 다른 방법

다른사람들의 답안을 확인해보니

1. 입력받은 자연수를 +"" 를 해줌으로써 문자열로 바꿔주고

2. 문자열의 요소 하나하나를 reduce() 메서드를 사용해 다 더해주기

방식으로도 많이들 풀었길래 인상깊어서 적어보려고 한다. 

 

자바스크립트에서 + 연산시에 문자열이 있으면 숫자+문자열 = 문자열 로 인식이 된다. 그 점을 이용해서 입력받은 자연수를 자연수로 바꿔줄 수 있다. 

그리고 n+"".split() 를 해서 문자열로 바꾸어주었기 때문에 curr 값도 문자일 것이고 때문에 parseInt(curr) 작업을 해주어 문자를 숫자로 바꿔주면 된다!

function solution(n) {
   return (n + "").split("").reduce((acc, curr) => {
   return acc + parseInt(curr); //
  }, 0);
}

 

reduce() 메서드를 처음 적용해봐서 관련 문서를 찾아보았다. 

https://bigtop.tistory.com/69 

[JavaScript] 자바스크립트 reduce 메서드 이해하기

reduce메서드의 매개변수로 콜백함수와 초기(누산값)이다. 두번째 매개변수가 왜 있는지 이해가 잘 안됐는데 위의 포스트를 읽고 이해완.

 

내가 예제를 만들어 reduce의 동작을 확인해보았다. 

const arr = [1, 3, 5];

arr.reduce(function (a, b, c) {
  console.log(`a:${a}, b:${b}, c:${c}`);
  return a + b;
}, 0);

reduce 함수의 매개변수로 들어간 콜백함수의 매개변수를 a, b, c 로 주었는데 출력결과를 보면 유추해볼수 있듯이

a 첫번째 매개변수 -> 현 인덱스의 앞 요소들의 누적값

b 두번째 매개변수 -> 현 인덱스에 저장된 값

c 세번째 매개변서 -> 현 인덱스 위치

로 정리해보았다. 

reduce 메서드의 두번째 매개변수가 0 인 이유도 위 포스트에 잘 설명되어 있듯이 arr 배열의 첫번째 요소를 지나칠때 앞선 요소들의 누적값이 없기때문에 임의로 0을 넣어주는 것이다.