[자바스크립트 기초] 간단한 기초계산기 Javascript 구성하기
[자바스크립트 기초] 간단한 기초계산기 Javascript 구성하기
이번 시간은, 자바스크립트로 아주아주 간단한
기초계산기를 한번 구성을 해 보도록 하겠습니다.
매우 쉽습니다. 너무너무요~!
...사실 쉽습니다...라고 말해놓긴 했어도...
말이 쉽지...그게...ㅠ_ㅠ 이해력이 좋으신 분들에 한해서 말이죠.
어쨌든~ 한번 스크립트가 어떤식으로 짜여져 있는지 한번 보도록 하지요.
일단, 계산기 레이아웃은 이렇게 구성되어 있습니다.
간단하죠?? ㅎㅎㅎ 점차점차 늘려나갈 계획이에요^^
덧샘, 뺄샘, 곱샘, 나눗샘만 되며, 차후에
여러가지 기능을 추가적으로 등록할껀데...음...더 공부를 해야...ㅠ_ㅠ
아무튼, 이렇게 간단히 구성을 해 본 자바스크립트 계산기는 어떻게 구성이 되어 있는지 한번 알아봅시다!
<body> 부분 입니다.
이 부분에서는 레이아웃 부분만 구성이 되어 있으며,
입력란과 연산버튼에 대해 클릭했을때 실행되는 함수 부분을 지정해주는 역할을 하지요.
바디 위에 전체적 스크립트 입니다.
위에 4개의 스크립트는 덧샘,뺄샘,곱샘,나눗샘에 대한 공식이 들어가 있는 함수 부분이고,
밑에 click_in() 함수는, 이제 입력받는 숫자와, 어떤 연산을 처리를 할지 처리되게 하는 함수 부분입니다.
덧샘이냐~ 뺄샘이냐~ 고것이 문제로다~
일 때! 클릭한 연산이, 저 OP에 입력이 되는데요~!
입력되면서 숫자랑 같이 해당연산이 실행이 되게 됩니다.
자세하게 풀어 보겠습니다.
이렇게 구성되어 있어요.
V1, V2, V3 의 변수는 숫자만을 입출력 받게 되는 변수 입니다.
이 부분을 보시면,
공식이 들어가 있음을 확인하실 수 있습니다. ㅎㅎㅎ
각 해당 버튼은 이렇게 처리가 됩니다.
색상별로 잘 보시면 좀 더 이해가 되실 것 같습니다.
이렇게 처리가 됨을 아시고~
이제 저 스크립트를 노트패드나, 어도비 브라켓을 이용하여 한번 직접 따라서 써보세요.
무엇보다도 써보는 것이 가장 많이 도움이 됩니다.
저같은 경우는, 지금 솔직히 막힌 상태에요;;;
그래도 그냥 무조건 쓰고 있어요. 일단 눈과 손에 익숙해져야죠^^;
기초계산기, 어떠신가요?
시작이 반! 언젠간 훌륭한 계산기를 완성할 날이 오겠지요^^
