TIL 210727 - Advanced calculator, 튜링기계 공학자들의 지혜<차곡차곡 쌓기>

오늘은 7일째 조금 지쳐갈 수도 있지만

이거슨 장거리 마라톤과 같다.

늦게까지 과제를 붙잡고 추가 공부를 할 수도 있지만

군인처럼 운동선수 처럼 규칙적인 생활이 

성공적인 부트캠프 퇴소에 도움을 줄 수 있다.

Top-tier developer의 목표를 달성하기 위해

주어진 하루와 한주 한달을 내실있게 보내자!

 

자 어제는

기본적인 계산기 구현을 완성하였고,

 

페어 시작!!

 

오늘은 난이도 '중하' 정도의 개선된 계산기 구현을 페어분과 함께 고민하였습니다.

 

오전 9시 부터 오후 6시까지 페어 협업과 개인 작업을 통하여서

advanced 수준의 계산기를 구현하였다.

 

CSS를 통한 프론트 디자인은 조금 미흡하지만

 

한 화면에 입력되는 숫자를 다 표시하고

사칙연산자를 입력하고

다음 숫자를 입력할 때 그 숫자들을 모두 표시해주는 로직

 

그리고 Enter 입력시

입력받은 처음 숫자와 연산자 두번째 숫자를

가지고 calculate 함수에 전달인자(argument)로

대입시켜 결과 값을 표시해 주는 기능을 가진 계산기이다.

 

소스코드 작성 중 가장 어려웠던 부분

'연산자를 입력한 후 새로운 숫자를 입력하면

기존 숫자를 지우고 새로운 숫자가 표시되고 그 표시된

숫자와 다음에 입력될 숫자를 연속적으로 연결해서 보여주는 것'

이 가장 구현하기 어려웠다.

 

풀어낸 핵심 로직은

바로 1) 연산자를 입력한 후 새로운 숫자를 입력할 때

기존에 입력된 숫자를 firstNum이라는 변수에 할당하고

2) 두번째 입력되는 숫자와 그 다음에 입력될 숫자의 if분기 기준을

firstNum이 undefined 인지 여부로 삼았다.

 

        if(firstNum === undefined) {
          firstNum = display.textContent;
          display.textContent = buttonContent;
          operatorForAdvanced = previousKey;
          console.log('3');
        } else {
          display.textContent = display.textContent + buttonContent;
          console.log('5');

위 소스에서 보듯

firstNum 이 undefined일 경우 display.texContent를 firstNum에 할당하였다.

그리고 그 이후에 입력되는 숫자는 firstNum이 있는 상태이기 때문에

buttonContent를 display.textContent와 연결해주어 표시해 줄 수 있게 했다.

 

나의 공부방법은 레퍼런스 코드를 보지 않고

최대한 시간을 많이 투입해서 과제를 해결하는 것이다.

 

이렇게 하는 이유는 알고리즘의 구현은 결국

나의 사고력과 논리력을 통해서 이루어진다고 생각하기 때문에

컴퓨터적인 사고력과 이를 뒷받침하는 수학적 혹은 기계적 논리력을

단시간에 키우기 위해서이다.

 

그리고 위와 같은 맨땅에 헤딩하기의 공부방법이

비효율적인 부분이 있는 것도 알고 있다.

그러나 복잡한 것도 하나씩 근거를 가지면서

쌓아 올리는

튜링기계를 실현하는 공학자들의 지혜

'속내용을 감추며 차곡차곡 쌓기'를

하기 위해서이다.

 

차곡차곡쌓기는 맨 밑바닥 계층에서 부품을 만들어

그 다음 윗단계 물건을 만들고 

그 다음 윗단계에서는 이렇게 만든 물건을

사용해서 그 윗단계의 물건을 만든 방법이다.

<이광근, 2015, 컴퓨터 과학이 여는 세계, -

세상을 바꾼 컴퓨터, 소프트웨어의 원천 아이디어 그리고 미래>

 

나도 차곡차곡 쌓기에 contribute하려면

레퍼런스 코드 보지 않고

나의 로직을 코드로 구현하는 연습부터 해야 한다.

 

이것이 그 시작이다.

 

코플릿 끝!!