Front-End/JavaScript

[자바스크립트] 타입(형) 변환

챌링킴 2021. 6. 6. 14:33
반응형

1) 타입 변환

- 변수는 타입이 고정되어있지 않다.

- 변수에 다른 타입의 값을 대입해준다.

let a = 10; // 숫자형

...

a = "자바스크립트"; // 문자열형

 

1. 자동 타입 변환(암시적)

- 타입의 값을 기대하는 곳에 다른 타입의 값이 오면 자동으로 타입을 변환해서 사용한다.

const a = "20"; // 문자열형

const b = "10"; // 문자열형

 

let result = a+b; // 2010 => 여기서 + 는 연결연산자를 뜻한다.

result = a-b; // 10 => 자동 타입 변환된다.

result = a*b; // 200 => 자동 타입 변환된다.

result = a/b; // 2 => 자동 타입 변환된다.

 

const c = "자바스크립트";

result = c-a; // NaN

*NaN(Not a Number) : 정의되지 않은 값이나 표현할 수 없는 값, 숫자로 변환할 수 없는 연산을 시도한 경우

*isNaN(값) : 숫자가 아니면 참, 숫자면 거짓

isNaN(10) : false

isNaN("10") : false

 

    <script>
        'use strict';
        const a = 10 + "문자열";
        console.log(a); //10문자열
        const b = "3"*"5";
        console.log(b); //15
        const c = 10-"자바";
        console.log(c); //NaN
        const d = "10"-5;
        console.log(d); //5
    </script>

 

2. 강제 타입 변환(명시적)

- 자바스크립트는 자동으로 타입 변환을 지원하지만 명시적으로 변환할 필요가 있을 때 사용하는 함수이다.

const a = "20"; // 문자열형

const b = "10"; // 문자열형

const result = Number(a) + Number(b); // 30

** Number( ) : 문자를 숫자로 변환시켜주는 함수

 

** String( ) : 숫자나 불린등을 문자열형으로 변환

 

** Boolean( ) : 문자나 숫자등을 불린형으로 변환

 

** Object( ) : 모든 자료형을 객체형으로 변환

 

** parseInt( ) : 문자열형을 int형(정수)으로 변환

 

** parseFloat( ) : 문자열형을 float형(소수)으로 변환

    <script>
        'use strict';
        const num1 = "10";
        const num2 = "5";
        console.log(`현재 num1의 타입 : ${typeof num1}`); //string
        console.log(`num1 + num2 : ${num1+num2}`); //105
        console.log(`Number(num1) + Number(num2) = ${Number(num1) + Number(num2)}`); //15
    </script>
반응형