[자바스크립트] 형변환

Gammi·2022년 9월 22일
0

JS

목록 보기
4/22
post-thumbnail

✔ 형변환


  • 함수와 연산자에 사용되는 값은 대부분 적합한 데이터타입으로 자동 형변환이 일어남

  • 상황에 따라 개발자가 의도한 타입으로 변환하는 것을 명시적 형변환(= 강제 형변환)

  • 데이터타입 첫 글자를 대문자로 지정하여 형변환 연산자 사용 가능


< 명시적 형변환 기본 문법 >

데이터타입(데이터)


🔗 참고

데이터타입을 소괄호로 감싸는 자바와 달리 자바스크립트는 데이터를 소괄호로 감싸서 형변환





1. 문자(string) 타입으로 변환


  • alert( ) 함수의 파라미터는 string 타입이며, 다른 타입 전달 시 자동으로 string 타입으로 변환됨

var value = 1;
value = String(value);
// number 타입을 string 타입으로 변환
// 첫 글자 대문자 필수

var value2 = true;
value2 = String(value2);
// boolean 타입을 string 타입으로 변환 
// 데이터타입을 ()안에 넣는 자바와 달리 
// 자바스크립트는 변수명을 () 안에 넣기 때문에 주의!

2. 숫자(number) 타입으로 변환


  • 수학 관련 함수나 연산자를 사용한 연산 과정에서는 자동으로 숫자 타입 형변환 일어남

    -> 문자형숫자(string) / 문자형 숫자(string) = 숫자(number) 타입으로 변환 후 연산

  • 주로 prompt( ) 함수 등을 사용하여 데이터 입력 시 문자로 취급되므로 변환 시 사용


var strNum = prompt("정수를 입력하세요");
// prompt( ) 함수의 파라미터는 string 타입

var num = Number(strNum);

// switch-case문의 case 사용 시 문자 데이터일 경우 숫자로 자동 형변환이 일어나지 않으므로
// 강제 형변환을 통해 number타입으로 변환해야만 정수 형태의 값 비교 가능

switch(Number(strNum)) {
  case 1 : // 강제형변환을 했기 때문에 number형태로 판별 가능
    document.write("입력된 값은 1입니다");
  case 2 : 
    document.write("입력된 값은 2입니다");

⛔ 주의

string 타입에서 number로 변환 시 숫자 데이터 외의 다른 데이터가 섞여 있을 경우 변환 과정에서 number 타입으로 변환은 일어나지만 데이터에 특수한 값(NaN)이 저장됨

*NaN : Not a Number의 약자로 숫자가 아닌 데이터라는 특수한 값

⭐ 입력

var strNum2 = "1234a";
document.write(strNum2 + " => 변환 전 타입 : " + typeof(strNum2) + "<br>");

var strNum2 = Number(strNum2);
document.write(strNum2 + " => 변환 후 타입 : " + typeof(strNum2) + "<br>");

📌 출력

1234a => 변환 전 타입 : string
NaN => 변환 후 타입 : number

-> 데이터타입은 number로 변환되었지만 데이터 값은 특수 값인NaN로 바뀜


⛔ 주의

자바스크립트의 변수는 데이터타입이 자동으로 결정되므로 결과값이 실수가 되는 연산 결과는 실수 형태로 그대로 저장됨
-> 연산 결과를 정수 형태로 변환 후 비교해야 함
-> parseInt(값) : 지정된 값을 정수 형태로 변환해 줌


var age = 15;
if(age / 10 == 1){
  document.write(age + "10대입니다!");
} else {
  document.write(age + "10대가 아닙니다!);
}

  • 판별 불가!

  • 15 / 10의 몫은 1.5

    -> 자바에서 int 타입끼리의 연산 결과가 int로 나오는 것과 실수가 그대로 저장되는 자바스크립트에서는 10대가 아닌 것으로 판별되므로 정수로 형변환이 필요!


var age = 15;
age = parseInt(age/10); // 정수로 바꾼 후 if문 조건 판별
if(age == 1){
  document.write(age + "10대입니다!");
} else {
  document.write(age + "10대가 아닙니다!);
}
profile
개발자가 되었어요⭐️

0개의 댓글