Jaypedia

자바스크립트로 계산기를 만들 때, 가장 먼저 생각해 볼 것은 입력된 숫자와 연산자들을 저장하는 방법이다. 이것을 쉽게 구현할 수 있도록 하는 것이 Class이다. 클래스 안의 다양한 함수들을 통해 계산기의 각 기능을 세분화하여 동작하도록 하였다. 1. 자바스크립트로 조작해 줄 HTML 요소들을 가져오기 const numberButtons = document.querySelectorAll('[data-number]'); const operationButtons = document.querySelectorAll('[data-operation]'); const equalsButton = document.querySelector('[data-equals]'); const deleteButton = documen..

자바스크립트를 이론 위주로 공부하여 조금씩 흥미를 잃고 있던 무렵, 뭔가를 만들어 보기로 결심했다. 기본적인 것 같으면서도 배울 게 많을 거라 생각해서 계산기를 만들어 보기로 했다. 백지에서 만들기는 어려울 것 같아 유튜브에 검색을 했고, 정말 많은 튜토리얼들이 있었지만 그중 Web Dev Simplified의 영상으로 골랐다. 예전에 Todo List를 따라 만든 적이 있는데 괜찮았기 때문이다. (이것도 나중에 포스팅으로 다뤄 볼 예정) 카일이 설명을 해 주는데, 차분하면서도 물 흐르는 듯한 막힘없는 설명이 특징이다. 이 포스팅은 한 번에 하려다가, 자바스크립트 부분이 좀 길어질 것 같아서 두 편으로 나누었다. HTML JavaScript Calculator AC DEL ÷ 1 2 3 × 4 5 6 +..