코드 리팩토링 도전기

자바스크립트를 배우고 있는 중이라 새로운 내용을 배울 때마다 팀과제로 내가 짰던 야구공 게임 코드를 리팩토링 해보고 있다.

1. 함수나 변수의 이름을 좀 더 명료하게 지을려는 노력을 했다. 생각보다 훨씬 긴 이름의 함수명을 사용하기도 하더라. 짧고 간단하게 짓기 보다 어떤 기능인지 분별될 정도의 이름이 좋은 것 같다.

2. 전역에 뿌려진 코드를 정리하려고 노력했다. 먼저 가장 먼저 출력되는 '컴퓨터가 숫자를 생성하였습니다. ~~~'는 볼의 랜덤 숫자 값을 저장하는 함수는 게임 진행 중 한 번만 동작하기 때문에 볼의 랜덤 숫자 값이 정해질 때 같이 출력해도 문제가 없을 것 같아 같이 넣어놨다.

3. 이곳저곳에 중복되는 코드는 함수로 묶어서 필요할 때 호출되도록 수정하였다.

   Before
   readline의 .on("line")을 사용하면서 터미널의 프롬포트를 원하는 문구로 수정하기 위해 setPrompt와 prompt를 사용했었다. 그런데 게임을 시작하면서 '1번째 시도 :'를 프롬포트에 찍고 싶었는데 한 번 입력을 해야 2번째 시도부터 프롬포트 문구가 찍혀서 전역에도 중복해서 사용했었다.

   after
   gameStartMesege 함수에 setPrompt와 prompt을 담았다.
   gameStartMesege는 게임이 시작할 때 1번, r.on에서 사용자의 입력값을 받았을 때와 입력값이 3개가 아닐 경우 호출된다. if문을 사용해서 사용자의 입력값을 받았다면 compareNumbers을 호출하여 입력값과 정답을 대조한다.

4. 함수에 들어있는 기능 분리를 하였다. 기존의 comparison에서 정답 결과를 출력하는 부분과 정답과 입력값을 대조하는 기능이 분리되어 보였다.

5. 전날에 Set을 배워서 연습삼아 적용했었다. 그런데 사용자의 입력값과 정답을 대조 할 때 배열로 다시 전환해야해서 비효율적이라 롤백했다.

6. 기초 알고리즘 문제를 풀며 알게된 방법으로 사용자의 입력값을 받는 코드를 수정했다.
   그리고 사용자가 3개의 수가 아닌 다른 개수로 입력했을 때 '서로 다른 3개의 수를 입력해주세요!'라는 안내 메시지가 뜨도록 수정하였다.

   Before
   기존에는 for문으로 입력값 line을 split으로 나누어 push로 반복해서 writeArray의 배열을 채워넣었다.

   r.on('line', function (line) {
       let writeArray = [];
       if (line == 'exit') {
           r.close();
       } else {
           const arr = line.split('');
           for (let i = 0; i < line.length; i++) {
               writeArray.push(arr[i]);
           }
           trying++;
       }
       r.setPrompt(trying + '번째 시도 :');
       comparison(randomIndexArray, writeArray, trying);
       r.prompt();
   });

   after
   매개변수 값을 바로 split으로 나누고 map을 사용해 데이터 타입까지 지정하여 배열에 채워넣었다. 잘못된 값을 넣었을 때 안내 메시지는 과제에서 요구한 사항은 아니지만 실제 서비스에서는 충분히 고려할 만한 요소라고 생각하여 연습삼아 넣었다.

   r.on('line', function (input) {
       if (input == 'exit') {
           r.close();
       }
       if (input.length !== 3) {
           console.log('서로 다른 3개의 수를 입력해주세요!');
           gameStartMesege();
       } else {
           let writeArray = input.split('').map(Number);
           trying++;
           gameStartMesege(writeArray);
       }
   });

---

알고리즘 문제풀이

특정한 문자를 대문자로 바꾸기
프로그래머스 스쿨 - 코딩테스트

문제에서 제시한 예시 2개의 case는 통과를 했으나 my_string에 alp이 여렷 중복되는 사항이 고려되지 않았다. 이거 풀어보겠다고 시간도 많이 쓰고, 배열 메소드도 검색해보고, 이것저것 써보고. 알음알음 검색하고 수정해서 풀어냈으나 알고있는 메소드에서 충분히 간결하게 나올 수 있던 문제였다.

배열, 객체 그리고 같이 쓰이는 메소드들을 미리 알아둬야겠다.

Before

function solution(my_string, alp) {
    let num = 0;
    let string = my_string.split('').map(String);
    num = my_string.indexOf(alp);
    let answer = '';
    if (num === -1) {
        answer = my_string;
    } else {
        string.splice(num, 1, alp.toUpperCase());
        string.join('');
        answer = string.join('');
    }
    console.log(answer);
    return answer;
}

after

function solution(my_string, alp) {
    let answer = my_string.split(alp).join(alp.toUpperCase());
    return answer;
}

• 처음 알게 된 사실인데 alp을 기준으로 split을 사용해 분할하면 콘솔에 alp이 안 뜬다.
  주의해야 할 점은 콘솔에 안 찍힐 뿐 요소가 삭제된 것은 아니라고 한다.
  

• alp을 기준으로 나눈 자리에 join으로 대문자로 바꾼 alp을 끼워넣어 문자열로 결합시킨다.