Javascript 뉴비입니다, 계산기를 만들었는데 조언 부탁드립니다.

Question

안녕하세요, 이제 막 Html과 JavaScript를 배우기 시작한 뉴비입니다. 이번에 계산기를 만들었는데 https://codesandbox.io/s/calculator-ruw7m?file&#61;/src/styles.css , 혼자서 맨땅에 헤딩하는 느낌으로 작업하다보니 조언에 목말라 이렇게 글을 남깁니다. 코드를 살펴보시고 수정 할 점이나 개선 할 점등을 조언해주시면 정말 감사하겠습니다. 모두 좋은 하루 되시길 바랍니다 :D

드코 · Answer

완벽한데 eval()함수를 안쓰고 만들면 더 좋을거 같습니다

rivertec · Answer

아 ㅠㅠ 드코님 댓글덕분에 너무 안심되고 기분이 좋네요 어떻게 표현해야 과하거나 덜하지 않게 표현할 수 있을지 한참 고민했습니다. 소경 코끼리 더듬듯 만들었는데 그래도 어떻게 코끼리 그림이 나온거 같아서 정말 다행이네요. eval()함수를 대체 할 수 있는 방법을 구글링해보겠습니다. 감사합니다! :D

몰랑토끼 · Answer

2*5 &#43; 8/4 해보셧나요? 일반적인 수학으론 10&#43;2가 나와서 12가 나와야 하는데 4.5가 나오네요. 계산기는 연산자 우선순위가 제일 중요합니다. 괄호( ) 들과 소수점은 어디갔어요? 클릭이벤트 하나에 연산이 다 들어가있는데 이거 구분해주세요.

드코 · Answer

몰랑토끼 몰랑님 계산기에서는 4.5가 나오는게 맞습니다 윈도우 계산기로 해보세요

rezigrene · Answer

1. 변수 &#96;O&#96; 는 코드가 길어지더라도 &#96;operator&#96; 등으로 알아보기 쉬운명칭으로 하세요. 헷갈리기 쉬운 코드는 좋은 코드가 아닙니다. (숫자 0으로 착각했네요.) 2. eval은 사용하지 마세요. 현재 있는 기능상으로는 스크립트 인젝션이 일어나거나 할 거리는 없으나, 아예 사용을 안하는 습관을들이는 것이 좋습니다. 3. 현재까지 입력한 수식을 표현하는 기능은 나쁘지 않으나 연산자 우선순위로 인해 사용자에게 혼란을 줄수 있습니다. 몰랑토끼님과 같은 사용자의 불만이 나올 수 있음을 주의해 주시면 되겠습니다. (다만 적절히 괄호를 집어넣는것은 현재레벨로 쉽지는 않아보여 바로 권하지는 않겠습니다. 실무라면 ...기능제거?!)2 &#43; 2 * 2 &#61; 62 &#43; 2 &#61; 4(2 &#43; 2) * 2 &#61; 8 4. 계산의 중간값을 저장하는 용도로는 html의 input요소를 활용하기보다는 자바스크립트의 변수를 그대로 사용하시는 것이 좋습니다.

rivertec · Answer

몰랑토끼님 드코님 말씀대로 윈도우 계산기 그대로 구현해보려고 한거여서 그런거 같아요, memory기능을 넣는다고 하면 local storage 응용해서 만들면 좋을까요?? rezigrene님 조언 감사합니다 C: 1. 정말 안 그래도 작성하면서 변수와 tag function(안에 들어가는) 이름들 작성하는 규칙을 하나 만들면 좋겠다는 생각을 했어요, 혹시 정석 같은 방법이 있을까요? 2. function 을 만들어서 return을 사용해보려고 생각중입니다.3. memory 기능을 구현해볼까 하는데 local storage 응용하면 괜찮을까요? 혹시 구현할 수 있는 또다른 방법이 있다면 조언 부탁드려요, 4. int와 float 두가지가 계속 햇갈리는것과 머리속으로 구조를 잘 그리지 못한 것이 그렇게 작성한 이유인 거 같습니다. 조언해주신대로 시도해보려는데 간단하게 참고가 될만한 코드 한 두줄만 부탁드려도 될까요?

몰랑토끼 · Answer

드코 윈 10 계산기로 하니 12 나오는거 맞아요. 혹시 맥이신가요? 그리고 윈도우 계산기니 사람들이 가장 많이 쓰는 시스템 계산기인데 이런 오류를 범할까요?

rivertec · Answer

&#64;몰랑토끼 공학용은 그렇게 되는지는 몰랐네요, 저는 표준을 사용하고 있었습니다. 드코님도 표준 기준으로 말씀해주신거 같아요 :) 조금 더 실력을 쌓아서 공학용 계산기도 도전해보고 싶네요.

Javascript 뉴비입니다, 계산기를 만들었는데 조언 부탁드립니다.

9개의 답변

#noob 목록