회고 & 생각정리

[JS] 계산기 구현

반응형

코드스테이츠에서 계산기 동작을 자바스크립트로 계산기를 구현 해 보았습니다.

 

우선 코드를 짜면서 느꼈던 점은 알고리즘적 사고가 굉장히 중요하다고 생각을 합니다. 비유를 하게 된다면, 컴퓨터랑 이야기를 한다고 생각을 할때 뭔가 조금은 덜 어지러운 느낌인 것 같습니다. 컴퓨터는 아주 똑똑한 3살 아이라고 생각을 하면 스트레스를 덜 받는거 같습니다. 하나하나 다 이야기 해줘야하고 코드를 읽을 때에도 항상 서순에 의해서 읽기 때문입니다.

 

지금 이 글을 쓰고 있을 때에는 코드스테이츠 시작한지 2주가 시작 하고나서, 항상 코드를 짜면서 느끼는 것은 왜 안되는 것에 대해 집착하기보다 지금 나온 결과에 대한 원인을 찾는 것이 더 중요하다는 것이 느껴졌습니다. 원인과 결과가 명확해지고 코드를 이해할 때에 원하고자 하는 방향에 한발 더 나아가는 것을 느꼈기 때문입니다. 그렇다 보니 다른 동기들과의 코드도 비교 해봤는데 대부분의 동기들 보다도 코드가 깔끔하고 간결하다는 것을 느꼈습니다.

 

그리고 코드스테이츠에서 말하는 계산기 과정에서 가장 어려운(나이트메어) 과정에서 페어와 같이 진행을 하였는데, 항상 페어가 이렇지 않을까 라는 말에 항상 도움이 많이 되고 그렇지 않고 혼자 하게되면 잘못된 길로 빠져 나오기 어렵겠구나 라는 생각을 하였습니다. 계속 잘하려고 하는 페어 덕분에 자극도 받고 조금이라도 받게 되기도 합니다.

결론은 커뮤니케이션과 다른 사람의 의견을 받아들이는 자세가 중요한 것 같습니다. 페어는 제 자신의 이런점이 지켜지지 않는다 하더라도 꾸준히 스스로 돌아보는 자세를 가져야 할 것 같습니다.

 

아래는 자바스크립트의 계산기 일부분입니다.

 

if (action === 'operator') {
	if(firstNum !== undefined && previousKey !== 'operator' && previousKey !== 'calculate'){
	display.textContent = calculate(firstNum,operatorForAdvanced,display.textContent)
	}
    
	previousKey = 'operator';
	firstNum = display.textContent;
	operatorForAdvanced = buttonContent;
	console.log('연산자 '+ buttonContent +' 버튼');
	}

 

계산기에서 연산자를 눌렀을 때의 동작 코드 입니다.

1. 3 * 3 * 에서 두 번째 *를 눌렀을 때에 계산이 자동적으로 되게하고, 첫 번째 눌렀을때에는 계산이 되지 않게 합니다.

2. 계산 버튼을 누르고 *를 눌렀을 때, 계산버튼에서 한번 연산자에서 한번으로 두번 계산 되지 않게 합니다.

이 2가지 조건을 if 문에 조건식에 넣었고 만족할 시에 연산자를 누를 때에 계산이 되도록 하였습니다.

그 외에 코드는 서순에 따라 삽입 하였습니다.

 

 

 

if (action === 'decimal') {
	if (previousKey === 'operator'){
	display.textContent = '0' ;
	}
    
	if (previousKey !== 'decimal'){
	display.textContent = display.textContent + buttonContent;
	previousKey = 'decimal';
	}
	}

계산기에서 . 를 눌렀을 때의 동작 코드 입니다.

1. 처음 if문은 연산자를 누르고 그 다음 숫자를 입력할 때에 0을 입력하지 않아도 0.xxx바로 되도록 구현을 하였습니다.

2. 두 번째 if문은 .을 여러번 입력했을때 중복해서 나타나지지 않도록 코드를 짰습니다.

 

1. if ~else if문을 사용하지 않은 이유는, if의 조건문과 else if 문 중에 결국 1개의 조건식만 실행이 됩니다.

2. 이중 if문을 사용하지 않은 이유는, 사용하면 첫 if에 만족하지 않을때 자연스레 안에 포함된 if문도 동작을 하지 않음으로 사용하지 않았습니다.

 

그렇기에 각 두개마다 각 각 동작하면서 실행 되야하는 상황이기 때문에 if문을 두번 사용하였습니다

반응형