JavaScript의 자료형과 특성(1)

☝ JavaScript의 형변환

JavaScript의 형변환(Type Conversion)
처음에 값으로 정해진 자료형을 다른 자료형으로 바꾸는 것이다.
JavaScript에서 제공하는 기본 함수를 활용하여 바꿀 수 있다.

1. 값을 문자로 바꿀 경우 Spring 함수 사용

예제 🏋️‍

• 숫자 -> 문자

let x = 123;
console.log(String(x));
결괏값: 123

• 불린 -> 문자

let x = true;
console.log(String(x));
결괏값: true

다른 형변환에 비해 비교적 형변환이 쉬운 편이며, 어떠한 값에 "" 또는 ''을 넣어 문자열로 변환한다고 생각하면 더 이해하기가 쉽다.

2. 값을 숫자로 바꿀 경우 Number 함수 사용

예제 🏋️‍

✔ 문자 -> 숫자

let y = '텍스트';
console.log(Number(x));
결괏값: NaN (숫자가 아님)

위처럼 값이 숫자형이 아닌 경우 NaN이 출력되지만

let y = '010';
console.log(Number(y));
결괏값: 010

숫자형태의 문자열은 위와 같이 숫자로 형변환이 된다.

✔ 불린 -> 숫자

let y = true;
console.log(Number(y));
결괏값: 1

let y = false;
console.log(Number(y));
결괏값: 0

Boolean의 경우 숫자로 형변환시 true = 1 / false = 0 으로 변환된다.

3. 값을 불린으로 바꿀 경우 Boolean 함수 사용

✔ 일반적으로 불린을 형변환시 값이 true인 형태로 형변환이 된다.

예제 🏋️‍

let z = '문자';
console.log(Boolean(z));
결괏값: true

let z = 123;
console.log(Boolean(z));
결괏값: true

✔ 그러나 숫자인 경우 그 값이 0, NaN 문자열의 경우 '' 빈 문자일 때는 false로 반환이 된다.

예제 🏋️‍

let z = 0;
console.log(Boolean(z));
결괏값: false

let z = '';
console.log(Boolean(z));
결괏값: false

4. 그 외에 자동으로 형변환이 되는경우

✔ 산술기호
(+, -, *, /, %, **)
더하기 연산자는 문자를 연결하는 경우가 있기 때문에 주의해서 사용해야 한다.
예로, 더하기의 경우 문자열을 연결하려는 기능이 더 강하기 때문에 한 쪽에 문자열인 값이 있다면 그 경우 무조건 문자열로 반환된다.

예제 🏋️‍

console.log('e' + 4);
결괏값: e4

불린은 숫자형으로 변환시 true = 1 / false = 0 의 값을 가지기 때문에 숫자형과 불린형의 계산시 아래와 같은 결괏값이 나온다.

console.log(true + 4);
결괏값 5

더하기 외에 나머지 연산의 경우 문자열과 숫자 계산시 NaN이라는 결괏값이 출력된다.

console.log('mean' / 4);
결괏값 NaN

---

✔ 관계 비교
(<, <=, >, >=)
관계 비교의 경우 true와 false중 하나의 값이 출력된다.

예제 🏋️‍

console.log('mean' >= 4);
결괏값: false

위의 경우 문자열인 'mean'은 불린으로 변환시 숫자 1이 되기 때문에 (1 >= 4)라는 의미를 가지게 되므로 false라는 결괏값이 나온다.

그 반대의 경우

console.log(ture > 0);
결괏값: true

true의 값은 숫자 1이므로 (1 > 0)과 같으므로 결괏값 true가 출력된다.

---

✔ 같음 비교
(===, !==, ==, !=)
같음 비교의 경우 아래의 두가지 경우가 존재한다.

일치 ===, 불일치 !== / 동등 ==, 부등 !=

이와 같은 경우엔 동등, 부등비교만 형변환이 된다.

예제 🏋️‍

console.log(0 === false);
console.log(0 == false);
결괏값: false
		true

---

❓왜 동일한 같음 비교인데 동등, 부등만 형변환이 가능하고 일치와 불일치는 형변환이 되지 않는 걸까?🤔❓

👇 ==, ===의 차이는 👇

Follow follow me!