📌 자바스크립트에서 비교 연산자 사용하기

자바스크립트에서 비교 연산자는 두 값을 비교하고 그 결과를 boolean 값(참/거짓)으로 반환하는 연산자입니다. 비교 연산자는 대소 비교와 등가 비교 두 가지로 나눌 수 있습니다. 이 글에서는 비교 연산자의 종류와 사용법에 대해 알아보겠습니다.

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" contect="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>비교 연산</title>    
</head>

<body>
    <script>
    // let age = parseInt(prompt("당신의 나이는?"))
    // console.log(20 <= age)
    let name = prompt("당신의 이름은?")
    document.write(`사용자의 이름은 ${name}입니다<br>`)
    document.write(`우리가찾던 사람인가? ${"이상인" === name}`)
    
</script>
</body>
</html>

 

🚦 비교 연산의 종류

자바스크립트에서는 두 값을 비교할 수 있는 여러 비교 연산자를 제공합니다. 이들은 대소 비교와 등가 비교로 크게 나눌 수 있습니다.

  1. 대소 비교: 크거나 작거나, 같거나 작은지 비교하는 연산자입니다.
  2. 등가 비교: 값이 같은지 또는 다른지를 비교하는 연산자입니다.

💻 비교 연산자의 종류

1. 대소 비교 연산자:

  • >: 왼쪽 값이 오른쪽 값보다 크다면 true를 반환.
  • <: 왼쪽 값이 오른쪽 값보다 작다면 true를 반환.
  • >=: 왼쪽 값이 오른쪽 값보다 크거나 같다면 true를 반환.
  • <=: 왼쪽 값이 오른쪽 값보다 작거나 같다면 true를 반환.

예시:

console.log(3 > 2); // true
console.log(5 < 4); // false
console.log(6 >= 6); // true
console.log(7 <= 8); // true

2. 등가 비교 연산자:

  • ==: 두 값이 같다면 true를 반환. (자료형에 상관없이 값만 비교)
  • !=: 두 값이 같지 않다면 true를 반환.
  • ===: 두 값이 엄격히 같다면 true를 반환. (값과 자료형이 모두 같아야 true)
  • !==: 두 값이 엄격히 같지 않다면 true를 반환.

예시:

console.log(3 == "3");  // true (자료형을 변환 후 값 비교)
console.log(4 != 4);    // false (값이 같음)
console.log(5 === 5);   // true (값과 자료형이 모두 같음)
console.log(5 !== "5"); // true (자료형이 다름)
  • **==**와 **===**의 차이:
    • ==는 추상적 비교로, 자료형을 변환하여 비교합니다.
    • ===는 엄격한 비교로, 값과 자료형이 모두 일치해야만 true를 반환합니다.

🚦 비교 연산의 특징

  1. boolean 값 반환:
    • 모든 비교 연산자는 boolean 값(참/거짓)을 반환합니다. 예를 들어, 3 > 2는 true를 반환하고, 5 < 3은 false를 반환합니다.
  2. 값 비교:
    • 비교 연산자는 값이 같은지 또는 다른지를 판단하는 데 사용됩니다. 이를 통해 조건문이나 반복문에서 조건을 설정하거나, 값을 비교하여 프로그램 흐름을 제어할 수 있습니다.

✅ 비교 연산자의 활용 예시

1. 조건문에서 비교 연산자 사용하기:

let age = 18;

if (age >= 18) {
    console.log("성인입니다.");
} else {
    console.log("미성년자입니다.");
}

2. 값이 같은지 비교하기:

let password = "1234";
if (password === "1234") {
    console.log("로그인 성공");
} else {
    console.log("비밀번호가 틀렸습니다.");
}

✅ 마무리

  • 비교 연산자는 자바스크립트에서 값을 비교하고, 그 결과를 boolean 값으로 반환하는 중요한 연산자입니다.
  • 대소 비교(>, <, >=, <=)와 등가 비교(==, ===, !=, !==)는 각각 값의 크기와 값이 같은지 또는 다른지를 비교합니다.
  • **===**와 **!==**는 엄격한 비교로, 자료형까지 비교하는 특징이 있습니다.
  • 비교 연산자는 조건문과 반복문에서 조건을 설정하거나 값을 비교할 때 매우 유용하게 사용됩니다.

이제 비교 연산자를 사용하여 더 복잡한 조건 처리나 값 비교를 할 수 있습니다!

'JavaScript' 카테고리의 다른 글

Chapter 2-14. 반복문 for(javascript)  (0) 2025.03.31
Chapter 2-13. 조건문(javascript)  (0) 2025.03.31
Chapter 1-9. DOM 소개  (0) 2025.03.31
Chapter 1-8. undefined 외  (0) 2025.03.31
Chapter 1-7. 템플릿 리터럴  (0) 2025.03.31

티스토리툴바