javaScript/자료와 변수

javaScript 비교 연산자 ( '===', '!==='), 형변환

bunbun2 2022. 11. 1. 12:28
비교연산자 ('===', '!===')

javaScript 에서 사용하는 비교 연산자는 6가지

let a = 10;
let b = 20;

console.log(a === b); // false
console.log(a !== b); // true
console.log(a > b);
console.log(a < b);
console.log(a >= b);
console.log(a <= b);

 

 

특이한 건 '===''!==' 이부분인데, javaScript에서는

console.log(a == b); //false
console.log(a != b); //true

이렇게 써도 무리 없이 비교가 가능하다.

 

 

 

다른 언어를 사용해본 사람들은 '==''!='가 익숙하기 때문에

이렇게 쓰는게 심적인 안정을 받을 것 같긴 한데, 이 연산자의 문제는

a = 10;
let c = "10";

console.log(a == c); //true

이렇게 다른 자료형끼리의 비교조차도 값만을 비교해 true로 반환해버린다는 점이다.

javaScript는 연산자를 사용할 때, 자료형이 맞지 않으면 알아서 형변환을 해버리기 때문이다.

 

 

 

그래서 맨 위에 나열한 비교연산자를 사용하면 자료형까지 진짜 비교를 할 수가 있다!

console.log(a === c); //false
console.log(a !== c); //true

 

 

 

연산자를 이용한 형변환

그런데 javaScript의 자동 형변환을 이용하는 방법도 있다.

형변환을 하는 함수들은 기본적으로 아래와 같이 세가지인데,

let a = "10";

a = Number(a);
console.log(typeof(a)); // Number

a = String(a);
console.log(typeof(a)); // String

a = Boolean(a);
console.log(typeof(a)); // Boolean

 

 

자동형변환을 이용해 간단하게 연산자로 형변환을 할 수 있다.

a = "10";

a = a - 0; // 문자열 a에 숫자 연산자 -, *, / 사용시 숫자로 자동 형변환. + 는 안된다
console.log(typeof(a)); // Number

a = a + ""; // 숫자 a 에 문자열 ""를 + 해 문자열로 자동 형변환
console.log(typeof(a)); // String

a = !!a; // 문자열 a 에 논리 부정연산자 !를 두번 사용해 원래의 값을 유지하고, 불로 자동 형변환
console.log(typeof(a)); // Boolean

개인적으로는 가독성이 떨어진다고 생각해서 자주 사용할 것 같진 않다.