[JavaScript] 내가보려고 작성하는 벨로그 08

Rookie·2022년 3월 30일
0
post-thumbnail

09-1. 비교 연산자

비교 연산자는 연산자 양쪽에 있는 두 값, 즉 좌항과 우항을 비교하는 연산자 입니다.

비교 연산자의 종류에는 동치 연산자(==, ===, !=, !==)와 관계 연산자(>, <, >=, <=)가 있습니다.
관계 연산자는 문자열(사전순으로 비교)과 숫자(크기로 비교) 데이터 타입을 비교할 때 사용됩니다.
동치 연산자는 다양한 데이터타입을 비교하는 경우 사용됩니다.


09-2. 일치 연산자(===)

조건문 등에서 자주 사용 되는 동치 연산자에 대해 살펴봅시다. if 문 예제에서 사용했던 === 연산자 기억하시나요? === 연산자는 연산자 양쪽에 있는 두 값을 비교하는 비교연산자 중 하나 입니다.

=== 연산자는 값과 타입이 같은지를 비교하는 동등 비교 연산자(equality operator) 입니다.
(cf. === 엄격(일치) 비교 vs. == 추상(동등) 비교)
if (answer === "비밀")
if (answer === "비밀")
왼쪽은 문자열이 담긴 answer 변수이고, 오른쪽은 텍스트인 문자열 입니다. 이렇게 String끼리 비교할 수도 있고, 숫자와 String을 비교할 수도 있습니다.

if (fullName === familyName + " " + "개발") {
}

if (fullName === familyName + " " + firstName) {
}

if (totalCost === 81.50 + 135) {
}

if (totalCost === average + 135) {
}
if (fullName === familyName + " " + "개발") {
}

if (fullName === familyName + " " + firstName) {
}

if (totalCost === 81.50 + 135) {
}

if (totalCost === average + 135) {
}
잠시 앞의 Assignment 를 보겠습니다.

console.log("2 더하기 2는 " + (2 + 2));
console.log("2 더하기 2는 " + (2 + 2));
컴퓨터는 왼쪽부터 코드를 실행하기 때문에 묶어주어야 했죠. 다음의 조건문의 조건 부분을 볼까요?

fullName === familyName + " " + "개발"
fullName === familyName + " " + "개발"
위의 코드는 우측에 () 괄호로 묶어주지 않았습니다. 그렇다고 "fullName === familyName" 먼저 계산 후, 뒤의 " " + "개발" 를 이어서 진행하는 것은 아닙니다. 비교연산자가 있을 때는, 비교연산자 기준으로 왼쪽/오른쪽 나눠서 코드를 실행하게 됩니다.


09-3. 불일치 연산자(!==)

이렇게 같은지를 비교하는 것이 아니라 !== 를 사용해서 서로 '같지 않음'을 비교할 수도 있습니다.

if (answer !== "비밀") {
alert("틀렸습니다.");
}
if (answer !== "비밀") {
alert("틀렸습니다.");
}

answer 값이 "비밀" 이 아니면, 다음 구문을 실행합니다. 즉 answer에 "비미", "secret", "빌미" 등 다른 값이 들어있으면 해당 조건은 "참"이 되므로 다음 구문을 실행하게 되는 것입니다.


09-4. 동등 연산자(==)

==는 동등 비교연산자(equality operator)입니다. '첫 번째 내용에 나왔는데 중복인가?' 하시겠지만, 차이점이 있습니다. 첫 번째는 =가 3개인 === 였고, 지금은 == 2개 입니다. ===는 엄격한(identity/strict) 비교연산자 이고, ==는 느슨한 비교연산자 입니다.

이제까지 텍스트는 String형이며, ""(쌍따옴표)로 표시한다고 하였고, 숫자는 Number형으로 "" 없이 숫자 그대로 사용합니다. 그런데 컴퓨터가 쌍따옴표로 되어있는 숫자를 만나면, '아.. 숫자긴 한데, 쌍따옴표로 감싸져있고, 텍스트(String)구나' 하고 알게 됩니다. 그래서 JavaScript에서는 느슨한 동등 비교가 가능합니다.

아래와 같이 == 로 비교하면 "3"과 3은 참입니다.

if ("3" == 3) {
return true;
}
if ("3" == 3) {
return true;
}
아래와 같이 === 을 사용하면 거짓입니다. 두 값의 type이 다르기 때문입니다. (문자열 vs 숫자)

if ("3" === 3) {
return false;
}

profile
노력형 잡캐입니다

0개의 댓글