문자열형

웹 프로그래밍 기초/변수

문자열형

별초롱언니 2025. 4. 1. 17:34

개념 및 사용방법

0개 이상의 2byte 유니코드 문자들로 구성되며, 텍스트 데이터를 나타내는데 사용한다.

문자열을 변수에 할당할 때는 'abc' 또는 "abc" , `abc`와 같이 따옴표 혹은 백틱(` `)으로 묶어 표현한다.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>데이터에 따른 자료형_문자열형</title>
  <script>
    var str01 = "I am JavaScript.....";
    var str02 = 'I am JavaScript.....';
    var str03 = `I am JavaScript.....`;
    var str04 = String("I am JavaScript.....");
    var str05 = new String("I am JavaScript.....");

    document.write(str01 + ' : ');
    document.write(typeof str01 + "<br>");
    document.write(str02 + ' : ');
    document.write(typeof str02 + "<br>");
    document.write(str03 + ' : ');
    document.write(typeof str03 + "<br>");
    document.write(str04 + ' : ');
    document.write(typeof str04 + "<br>");
    document.write(str05 + ' : ');
    document.write(typeof str05 + "<br>");

    
    // $와 {} 통해서 사용
    document.write(`${str01} : ${typeof str01} <br>`);
    
    var num01 = 2;
    var num02 = 3;
    document.write(`num01 + num02 = ${num01 + num02} <br>`);
    
  </script>
</head>
<body>
  
</body>
</html>

이스케이프 문자	분류
\n	개행문자. 커서를 다음 줄로 이동
\t	커서를 탭 키만큼 이동
\b	커서를 앞으로 한칸 이동
\f	커서를 다음 페이지로 이동
\r	커서를 그 줄 처음으로 이동
\\	￦ 문자 표시
\'	' 문자 표시
\"	"문자 표시

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>이스케이프 문자</title>
  <script>
    var str01 = "first line \n second line \n";
    var str02 = 'first statement \t second statement \n';
    var str03 = "first statement \b second statement \n";
    var str04 = "c\\javascript";

    console.log(str01 + '\n' + str02);
    console.log(str02);
    console.log(str03);
    console.log(str04);
  </script>
</head>
<body>
  
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>데이터에 따른 자료형_문자열형(백틱사용법)</title>
  <script>
    var num1 = 150;
    var num2 = 120;
    document.write("내가 가진 숫자는 " + num1 + " 입니다. <br>");
    document.write(`내가 가진 숫자는 ${ num2 } 입니다. <br>`)
  </script>
</head>
<body>
  
</body>
</html>