프롬프트(prompt)로 두 개의 값 입력받기
JavaScript에서는 prompt() 메서드를 사용해 사용자로부터 값을 입력받을 수 있습니다. 예를 들어 두 개의 값을 입력받는 코드는 다음과 같습니다.
var firstvalue = parseInt(prompt("Enter the value1"));
var secondvalue = parseInt(prompt("Enter the value2"));
parseInt()는 prompt()로 입력받은 문자열을 정수로 변환하는 함수입니다. 이 함수를 생략하면 값이 문자열로 취급되어 곱셈과 같은 산술 연산에서 의도한 대로 동작하지 않을 수 있으므로 반드시 함께 사용하는 것이 좋습니다.
예제 코드
입력받은 두 값의 곱이 50보다 큰지 판별하는 전체 코드는 다음과 같습니다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<body>
</body>
<script>
var firstvalue = parseInt(prompt("Enter the value1"));
var secondvalue = parseInt(prompt("Enter the value2"));
if (firstvalue * secondvalue > 50)
document.write("<h1>Result is correct</h1>");
else
document.write("<h1>Result is not correct</h1>");
</script>
</html>
프로그램 실행 방법
위 프로그램을 실행하려면 파일을 anyName.html(또는 index.html)로 저장합니다. 이후 VS Code 편집기에서 해당 파일을 마우스 오른쪽 버튼으로 클릭하고 "Open with Live Server" 옵션을 선택하면 브라우저에서 바로 실행할 수 있습니다.
실행 결과 확인
프로그램을 실행하면 첫 번째 값을 입력하라는 프롬프트 창이 나타납니다.
여기서는 첫 번째 값으로 10을 입력해 보겠습니다.
확인(OK) 버튼을 클릭하면 두 번째 값을 입력하라는 창이 나타납니다.
두 번째 값으로도 10을 입력합니다.
확인(OK) 버튼을 클릭하면 최종 결과가 화면에 출력됩니다. 두 값의 곱(10 × 10 = 100)이 50보다 크므로 "Result is correct"라는 결과가 표시됩니다.
정리
이처럼 prompt()로 사용자 입력을 받고, parseInt()로 숫자형으로 변환한 뒤, if ~ else 조건문으로 평가하면 누구나 손쉽게 간단한 인터랙티브 프로그램을 만들 수 있습니다. 조건식만 변경하면 덧셈, 나눗셈 등 다양한 연산 결과도 같은 방식으로 판별할 수 있습니다.