티스토리 뷰

반응형

웹 페이지에서 자주 사용하는 것 중 하나가 형변환입니다. 언어에 상관없이 문자열을 숫자로 바꾸거나 숫자를 문자로 바꿔서 사용해야할 일이 생깁니다. 

 

1. 문자형을 숫자형으로 변환하는 법

<!doctype html>
<html lang="ko">
  <head></head>
  <body>
    <script>
    
      var x = "100";
      var y = "100";
      
      console.log(x + y); //100100
      console.log(Number(x) + Number(y)); //200
      
      var x1 = "100";
      var x2 = "100.21";
      
      console.log(parseInt(x1)); //100
      console.log(parseInt(x2)); //100

      console.log(parseFloat(x1)); //100
      console.log(parseFloat(x2)); //100.21
      
      console.log(Number(x1)); //100
      console.log(Number(x2)); //100.21
      
    </script>
  </body>
</html>

위 코드를 참고하면 다양한 숫자형으로 변경해주는 함수를 보실 수 있습니다. parseInt()는 문자를 정수형 숫자로 변환해주고 parseFloat()는 문자를 실수형 숫자로 변환해줍니다. Number()는 문자의 타입에 따라 정수형이나 실수형 숫자로 변환해주는 함수입니다.

 

2. 숫자형을 문자형으로 변환하는 법

<!doctype html>
<html lang="ko">
  <head></head>
  <body>
    <script>
    
      var x = 100;
      var y = 100;
      
      console.log(x + y); //200
      console.log(x + "" + y); //100100
      console.log(String(x) + String(y)); //100100
      
      var x1 = 100;
      var x2 = 100.123456;
      
      console.log(String(x1)); //"100"
      console.log(String(x2)); //"100.123456"

      console.log(x1.toString()); //"100" : 10진수
      console.log(x1.toString(2)); //"1100100" : 2진수
      console.log(x1.toString(8)); //"144" : 8진수
      console.log(x1.toString(16)); //"64" : 16진수
      
      console.log(x2.toFixed()); //"100"
      console.log(x2.toFixed(1)); //"100.1"
      console.log(x2.toFixed(4)); //"100.1235"
      console.log(x2.toFixed(6)); //"100.123456"
      console.log(x2.toFixed(7)); //"100.1234560"
      
    </script>
  </body>
</html>

문자형을 숫자형으로 바뀌는 사용하는 대표적인 함수는 String() 이 있습니다. String 함수를 사용하면 정수형이나 실수형 숫자를 그대로 문자형으로 변환할 수 있습니다. 

 

Javascript에서는 String 함수를 사용하지 않더라도 문자형이 숫자형보다 우선이기 때문에 100 +""+ 100 처럼 값을 더할 경우에도 숫자형들이 자동으로 문자형으로 변환되어 100100 로 값이 표현됩니다.

 

toString() 이나 toFixed() 함수는 각각 진수 표현을 하거나 소수점을 수정해서 표현해야 할 경우 사용할 수 있습니다.

 

toString()은 인자값이 없는 상태로 사용하면 기본 10진수값으로 문자형 변환이 됩니다. 인자값이 들어갈 경우에는 2진수나 8진수 값으로 변환된 문자형으로 변환이 됩니다.

 

toFixed()는 인자값이 없는 상태로 사용하면 실수인 경우 소수점 첫째 자리에서 반올림을 한 값이 문자형으로 변환됩니다. 인자값을 1로 넣으면 소수점 첫째 자리까지 나타내라는 의미이기 때문에 소수점 둘째 자리에서 반올림을 해서 문자형 변환이 됩니다. 소수점 6자리까지 있는 실수에 인자값 7을 넣게 되면 0으로 자릿수를 채워준 상태로 문자형 변환을 해줍니다.

 

반응형
댓글
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함