[SEB_FE] 작동하는 계산기 만들기

⚙️ 기능

• 기본적인 사칙연산 기능
• 계산 버튼 누르지 않고 연산자 버튼만 눌러서 계속 계산
• 초기화 기능

 

---

🥲 어려웠던 점

 

처음엔 계산기의 가장 기본적인 기능을 구현하는 것이라고 생각해서 금방 할 수 있을 것 같다고 생각했습니다.
그런데 그 생각은 너무나도 오만한 생각이었습니다...
코드를 작성하고 호기롭게 테스트를 해보았지만 나오는 결과는 빨간 물결의 향연이었습니다.

엄청 많은 오류들과 싸웠는데 그 중 몇 가지를 소개해보겠습니다.

 

1. 연산자를 연속으로 다르게 눌렀을 때 처음 눌렀던 연산자로 고정이 되는 오류

if (previousKey === "operator") { 
    operatorForAdvanced = buttonContent; 
    return; 
}

이 경우도 생각을 꽤 해서 풀었는데 사실 결과는 간단하였습니다.
그냥 이전에 눌렀던 버튼이 연산자라면 계속 연산자를 업데이트해서 저장한 후, 뒤 조건들을 따지지 않고 리턴하는 것입니다.

 

2. 소수점을 한 번 찍고 나서도 또 찍을 수 있는 오류

// 처음 
if (firstNum.at(-1) !== ".") 
	curNum += "."; 
display.textContent = curNum;

// 수정
if (curNum.at(-1) !== "." && !curNum.includes(".")) 
	curNum += ".";
display.textContent = curNum;

처음에는 그냥 숫자의 마지막 자리에만 `.`이 없을 때만 붙여주려고 했는데 이렇게 하면 숫자.숫자.숫자 이런 식으로 

계속 붙일 수 있었습니다.

그래서 마지막 자리를 검사하는 동시에 .를 포함하고 있지 않을 경우도 검사하여 붙여주면 해결이 됩니다.

 

3. 계산 로직

계산 로직도 단연 까다로웠습니다.

if (!operatorForAdvanced) return;

일단 연산자 버튼을 누르지 않고 계산 버튼을 누르면 동작하지 않게 합니다.

 

let result = 0;
!curNum
	? (result = calculate(previousNum, operatorForAdvanced, previousNum))
	: (result = calculate(previousNum, operatorForAdvanced, curNum));

previousNum = result;
display.textContent = result;
previousKey = "calculate";

계산해야하는 방법도 두 가지 였습니다.
첫 번째 숫자와 연산자만 있을 때 계산하기, 그냥 계산하기 입니다.
그래서 현재숫자변수에 할당이 되어 있는 지에 따라 계산을 다르게 해주었습니다.

 

이 외에도 수많은 오류들과 싸웠는데 미처 기록을 하지 못하여 더 쓸 수가 없었습니다.
양해 부탁드립니다.

혹시 코드들에 대하여 피드백을 주실 수 있다면 환영입니다!!