조건문
조건문은 주어진 조건이 참인지 거짓인지 판별하여 다음 일을 처리합니다. 조건문의 기본 구조를 살펴보겠습니다.
조건문의 기본 구조는 if 문장 다음에 조건을 기술하고 그 존이 참일 때 처리할 내용이 다음 중괄호 안에 기술합니다. 해당 조건이 거짓일 때 처리할 내용은 else 다음 중괄호 안에 기술합니다.
조건문은 특정 조건을 평가하여 해당 조건에 따라 다른 코드 블록을 실행하도록 하는 구문입니다. 주어진 조건이 참인지 거짓인지에 따라 코드의 흐름을 제어할 수 있습니다. 가장 일반적인 조건문은 if문과 else문이며, 더 복잡한 경우에는 else if문과 switch문을 사용할 수 있습니다.
if 문
가장 기본적인 조건문으로, 주어진 조건이 참일 경우에만 해당 코드 블록을 실행합니다. 조건이 거짓인 경우 else문이 있으면 else 블록이 실행됩니다.
if (조건) {
// 조건이 참일 때 실행되는 코드
} else {
// 조건이 거짓일 때 실행되는 코드 (옵션)
}else if 문
여러 개의 조건을 검사하고, 순서대로 참인 첫 번째 조건의 코드 블록을 실행합니다. 여러 개의 조건을 체크해야 할 때 유용합니다.
if (조건1) {
// 조건1이 참일 때 실행되는 코드
} else if (조건2) {
// 조건1이 거짓이고, 조건2가 참일 때 실행되는 코드
} else {
// 모든 조건이 거짓일 때 실행되는 코드 (옵션)
}switch 문
여러 가지 경우에 따라 실행해야 할 코드를 지정할 때 사용합니다. 일반적으로 문자열이나 숫자 값을 기반으로 다양한 case로 분기하여 처리합니다.
switch (표현식) {
case 값1:
// 표현식과 값1이 일치할 때 실행되는 코드
break;
case 값2:
// 표현식과 값2가 일치할 때 실행되는 코드
break;
// ...
default:
// 어떤 case에도 해당하지 않을 때 실행되는 코드 (옵션)
}삼항 연산자
삼항 연산자는 if-else 구문을 간단하게 표현하는 방법입니다. 하나의 조건을 평가하고 조건이 참인 경우와 거짓인 경우에 각각 다른 표현식을 반환합니다.
조건 ? 참인경우_표현식 : 거짓인경우_표현식
조건문은 프로그래밍에서 매우 중요한 역할을 하며, 특정 조건에 따라 다른 동작을 수행하는 데 사용됩니다. 따라서 조건문을 잘 활용하면 더 유연하고 효율적인 코드를 작성할 수 있습니다.
조건문을 이용해서 자판기 프로그램 만들기
자바스크립트로 구성된 간단한 자판기 예제를 만들어보겠습니다. 이 예제는 사용자로부터 돈을 입력받고, 선택한 음료에 따라 거스름돈과 음료를 출력하는 간단한 자판기를 구현합니다.
<!DOCTYPE html>
<html>
<head>
<title>간단한 자판기 예제</title>
</head>
<body>
<h1>간단한 자판기</h1>
<p>음료를 선택하고 돈을 입력하세요.</p>
<label for="drink-select">음료 선택:</label>
<select id="drink-select">
<option value="cola">콜라 - 1000원</option>
<option value="sprite">스프라이트 - 1200원</option>
<option value="orange-juice">오렌지 주스 - 1500원</option>
</select>
<br>
<label for="money-input">돈을 입력하세요:</label>
<input type="number" id="money-input" placeholder="금액을 입력하세요">
<button onclick="purchase()">구매</button>
<div id="output"></div>
<script>
function purchase() {
const selectedDrink = document.getElementById("drink-select").value;
const moneyInput = document.getElementById("money-input").value;
// 입력한 금액을 정수로 변환
const money = parseInt(moneyInput);
// 음료 가격 설정
let price;
switch (selectedDrink) {
case "cola":
price = 1000;
break;
case "sprite":
price = 1200;
break;
case "orange-juice":
price = 1500;
break;
default:
alert("올바른 음료를 선택하세요.");
return;
}
// 거스름돈 계산
const change = money - price;
// 출력 결과 생성
let outputMessage;
if (change >= 0) {
outputMessage = `${selectedDrink}를 구매하였습니다. 거스름돈은 ${change}원입니다.`;
} else {
outputMessage = "돈이 부족합니다. 금액을 확인해주세요.";
}
// 결과를 화면에 출력
document.getElementById("output").innerText = outputMessage;
}
</script>
</body>
</html>이 예제는 간단한 HTML과 자바스크립트를 사용하여 자판기를 만들었습니다. 사용자가 음료를 선택하고 금액을 입력한 후 "구매" 버튼을 누르면 해당 음료를 구매하고 거스름돈을 출력합니다. 선택한 음료가 올바르지 않거나 돈이 부족한 경우 알림 창을 통해 사용자에게 메시지를 전달합니다.
비교 연산자
조건문에서는 비교 연산자로 조건을 작성해야 하기 때문에 알아두어야 합니다. 비교 연산자 앞 뒤의 값들을 피연산자라고 합니다.
< : 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작으면 true 반환
> : 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 true 반환
<= : 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같으면 true 반환
>= : 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같으면 true 반환
!= : 왼쪽 피연산자의 값이 오른쪽 피연산자의 값이 같지 않으면 true 반환
== : 왼쪽 피연산자와 오른쪽 피연산자의 값이 같으면 true을 반환
=== : 왼쪽 피연산와 오른쪽 피연산자의 값이 같고, 같은 타입이면 true을 반환
!== : 왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않거나, 타입이 다르면 true을 반환
중첩 조건문
조건문 안에 조건문을 작성하는 것입니다. 다음은 예입니다.
if(A !=B) {
if(A > B) {
document.write('A가 B보다 크다');
} else {
document.write('A가 B보다 작다');
}
} else {
document.write('A와 B가 같다');
}논리 연산자
논리 연산자를 이용하여 조건문을 좀 더 구체적으로 작성할 수 있습니다.
&& : 조건을 모두 만족하면 true를 반환, 하나라도 만족하지 않으면 false를 반환
|| : 조건 중 하나라도 만족하면 true를 반환, 둘 다 만족하지 않으면 false를 반환
다양한 연산자에 대한 궁금증이 있다면 아래를 참고하세요.
감사합니다.
'JavaScript' 카테고리의 다른 글
| 자바스크립트 Number 객체, Math 객체 지금 쓰자! (0) | 2023.07.25 |
|---|---|
| 자바스크립트 배열 합치기 concat() 함수, 전개 연산자 지금 쓰자! (0) | 2023.07.24 |
| 자바스크립트 배열 특정 문자로 시작하는지 알아보는 startWith() 함수 (0) | 2023.07.24 |
| 자바스크립트 배열 join, reverse, sort, push, pop, unshift, shift , slice , splice , filter , map , includes (0) | 2023.07.24 |
| 자바스크립트 객체 (0) | 2023.07.24 |
