#3-1 계산기

※소소한 개인 프로젝트 기록입니다.

1) 과정

이번 프로젝트는 '계산기'이다.

왜 3-1 이냐면, 현재 코드까지는 오직 두개의 수만 계산할 수 있기 때문!

이번에도 역시나 'Zero cho'님의 강의에서 아이디어를 얻었다.

(감사합니다🙇‍♀️ 강의 잘 보고 있습니다.)

항상 zero cho님의 유튜브 강의를 통해 강의를 보다가,

이번에 내신 자바스크립트 책이 온/오프라인으로 나와서 전자책으로 보고 있다!!

관련 링크는 아래 참고자료 칸에 첨부하도록 하겠다.

 

어떤 강의를 보고 클론 코딩을 하더라도,

항상 그분들 코드보다 조금씩은 더 기능을 추가해보려고 노력하는 편이라

이번에도 별거 아니지만 기능을 추가해보았다.

내가 임의로 추가한 기능과 함께 계산기의 전체적인 기능을 아래 적어보겠다.

 

- 사칙연산(더하기, 빼기, 곱하기, 나누기) 

- 연산 초기화 (C)

- 잘못된 숫자 한자리씩 지우기(추가)

 

당연해보일지 모르겠지만,, 

자바스크립트 입문자라서 나에겐 조금 어려웠다.

그래도 날이 갈수록 실력이 늘고 있기는 한 것 같은게

그래도 이정도는 조금만 고민해보면

이제 코드를 짤 수 있게 되었다!

얼른 기본적인 자바스크립트 문법 응용을 끝내고 다른 것두 배워보고 싶다...

 

아무튼, 눈에 보여지는 기능 외에도

자바스크립트에서 각 button(숫자, 연산자 등 계산기 버튼)에 대해

각각 eventListener를 사용한 게 아니라,

for문을 이용해서 click된 요소에만 특정 효과를 주었다.

관련 사항은 아래 글에!

2021.06.26 - [웹 공부] - [JavaScript] 클릭한 요소 인덱스 구하기 (querySelectorAll, onclick...)

여기 글에도 적어놨듯이, 좋은 방법인지 맞는방법인지는 잘 모르겠는데

뭔가 addEventListener를 반복해서 사용하는 게 별로라고 생각해서

그냥 적어봤다!

+++아니 이거 적다가 갑자기 생각나서 적어봤는데 되길래!!

그냥 그러면 ddEventListener를 for문 안에다 적어도 작동하는 거 아닌가? 해서 적어봤는데

역시나 된다~~ 이것도 위 글에 추가해놓도록 하겠다!

이렇게 소소한 거 알아가는 재미가 있다.

 

아무튼! 아직은 '두 수만' 계산하는 계산기를 만들어봤다.

조금 코드를 수정한 후, 연속해서 계산할 수 있는 계산기 또한 글로 작성해두겠다.

 

2) 결과

    

3) 참고자료

https://thebook.io/080270/

더북(TheBook): Let's Get IT 자바스크립트 프로그래밍

- zero cho님의 저서