Skip to content

15일차 과제 #43

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
one3883 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

15일차 과제 #43

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5ce00ef
15일차 과제
Feb 4, 2026
bb6eb93
15일차 과제
Feb 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
81 changes: 81 additions & 0 deletions KDG/Day15/계산기.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>계산기</title>
</head>
<body>
<h2>Soongu Calculator</h2>
<div><h3>계산식을 입력해 주십시오(예시 : 1+2 | 종료 : exit).</h3></div>
<div><ul><li>소수점 둘째자리 까지 계산됩니다.</li></ul></div>
<input type = "text" id = "in-text" />
<input type="button" id="in-btn" value="버튼" />
Copy link
Contributor

@electrohyun electrohyun Feb 4, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
<input type = "text" id = "in-text" />
<input type="button" id="in-btn" value="버튼" />
<input type="text" id="in-text" />
<input type="button" id="in-btn" value="버튼" />

띄어쓰기 및 공백은 일관되게 작성해주세요!


<script>
function getElement(id){
return document.getElementById(id);
}
const inbtn = getElement("in-btn");
const intext = () => getElement("in-text").value;
Copy link
Contributor

@electrohyun electrohyun Feb 4, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
function getElement(id){
return document.getElementById(id);
}
const inbtn = getElement("in-btn");
const intext = () => getElement("in-text").value;
const inbtn = document.getElementById("in-btn");
const intext = document.getElementById("in-text").value;

처럼 작성해봐도 좋지 않을까요? 이미 만들어진 메서드(getElementById())를 함수로 한번 더 감싸서 사용할 필요는 없는것 같아요.



const click = () => {
const userInput = intext();
const result = calculate(userInput);
print(result);
}
const exit = () => alert("계산기를 종료합니다.");

const exitcheck = (exit) => (exit === "exit" ) ? true : false;
function calculate(userInput) {
let result;
let n1,n2;
[n1, n2] = userInput.split(/[\+\-\*\/]/).map(Number);
switch (true){
case userInput.includes("+"):
result = add(n1, n2);
break;
case userInput.includes("-"):
result = minus(n1, n2);
break;
case userInput.includes("*"):
result = multipl(n1, n2);
break;
case userInput.includes("/"):
result = division(n1, n2);
break;
case exitcheck(userInput):
exit();
break;

}
return result;

}
Copy link
Contributor

@electrohyun electrohyun Feb 4, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

2+2/4 등의 수식 결과가 왜 4.00으로 출력될까요? 한번 소스코드를 보며 고민해봅시다.

inbtn.onclick = click;

const add = (n1, n2) => n1 + n2;
const minus = (n1, n2) => n1 - n2;
const multipl = (n1, n2) => n1 * n2;
const division = (n1, n2) => n2 === 0 ? "Error" : n1 / n2;
const A4 = () => getElement("in-text");

const print = (ingcle) => {
ingcle === "Error" ? alert("0으로 나눌 수 없습니다") :
A4().value = Number(ingcle).toFixed(2);




}
Copy link
Contributor

@electrohyun electrohyun Feb 4, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

실제로 계산이 끝난 값이 출력이 되고는 있습니다. 그러나 사용자가 수식을 입력한 input창 내부의 text를 변경하는 것이 아니라, input창 외부에 배치한 다른 text가 없는 빈 태그(span, p 등)에 값을 전달해서 표현해주는 방식이 과제 풀이 방식입니다.

크게 어렵지 않습니다만, 다른 요소의 value를 바꾸는 식으로 작성해보는 것을 도전해보셔도 좋을것 같아요.









</script>
Copy link
Contributor

@electrohyun electrohyun Feb 4, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

script를 html 파일과 분리하여 작성해주시면 좋을 것 같아요~

</body>
</html>