간단한 수식 "10 + 20은 30과 같다"를 예로 들어보겠습니다. 여기서 10과 20을 피연산자(operand)라고 하며, '+' 기호를 연산자(operator)라고 부릅니다. 자바스크립트는 다음과 같은 다양한 종류의 연산자를 지원합니다.
- 산술 연산자(Arithmetic Operators)
- 비교 연산자(Comparison Operators)
- 논리(또는 관계) 연산자(Logical or Relational Operators)
- 대입 연산자(Assignment Operators)
- 조건(삼항) 연산자(Conditional or Ternary Operators)
비교 연산자란?
비교 연산자는 두 값의 크기나 동등 여부를 비교하여 참(true) 또는 거짓(false)의 결과를 반환하는 연산자입니다. 프로그래밍에서 조건문과 반복문을 작성할 때 필수적으로 사용되는 핵심 요소입니다.
자바스크립트가 지원하는 주요 비교 연산자를 살펴보겠습니다. 변수 A에는 10이, 변수 B에는 20이 저장되어 있다고 가정합니다.
| 번호 | 연산자 및 설명 |
|---|---|
| 1 | == (동등 연산자, Equal) 두 피연산자의 값이 서로 같은지 검사합니다. 값이 같으면 조건식은 true가 됩니다. 예: (A == B) → false (A와 B는 10과 20으로 값이 다름) |
| 2 | != (부등 연산자, Not Equal) 두 피연산자의 값이 서로 다른지 검사합니다. 값이 다르면 조건식은 true가 됩니다. 예: (A != B) → true (A와 B는 값이 다르므로 참) |
| 3 | > (크다, Greater than) 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 큰지 검사합니다. 크면 조건식은 true가 됩니다. 예: (A > B) → false (10은 20보다 크지 않음) |
| 4 | < (작다, Less than) 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작은지 검사합니다. 작으면 조건식은 true가 됩니다. 예: (A < B) → true (10은 20보다 작음) |
| 5 | >= (크거나 같다, Greater than or Equal to) 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같은지 검사합니다. 그렇다면 조건식은 true가 됩니다. 예: (A >= B) → false (10은 20보다 크거나 같지 않음) |
| 6 | <= (작거나 같다, Less than or Equal to) 왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같은지 검사합니다. 그렇다면 조건식은 true가 됩니다. 예: (A <= B) → true (10은 20보다 작거나 같음) |
비교 연산자 예제 코드
아래 코드는 자바스크립트에서 비교 연산자를 실제로 사용하는 방법을 보여줍니다. 각 연산의 결과를 화면에 출력합니다.
<html>
<body>
<script>
var a = 10;
var b = 20;
var linebreak = "<br />";
document.write("(a == b) => ");
result = (a == b);
document.write(result);
document.write(linebreak);
document.write("(a < b) => ");
result = (a < b);
document.write(result);
document.write(linebreak);
document.write("(a > b) => ");
result = (a > b);
document.write(result);
document.write(linebreak);
document.write("(a != b) => ");
result = (a != b);
document.write(result);
document.write(linebreak);
document.write("(a >= b) => ");
result = (a >= b);
document.write(result);
document.write(linebreak);
document.write("(a <= b) => ");
result = (a <= b);
document.write(result);
document.write(linebreak);
</script>
</body>
</html>
실행 결과:
(a == b) => false (a < b) => true (a > b) => false (a != b) => true (a >= b) => false (a <= b) => true
참고로, 현대 자바스크립트 개발에서는 타입 변환 없이 값과 자료형까지 엄격하게 비교하는 ===(일치 연산자)와 !==(불일치 연산자)를 사용하는 것이 권장됩니다. 이는 예상치 못한 타입 강제 변환으로 인한 버그를 방지하는 데 도움이 됩니다.