Language/JavaScript + TypeScript

[JavaScript] 데이터 타입

깨구르르 2024. 3. 7. 11:32
728x90

1. Primitive type

1-1. Number type

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        let num = 100;
        console.log(num);
        console.log(typeof num);    //number

        let dnum = 3.14;
        console.log(dnum);
        console.log(typeof dnum);   //number
    </script>
</head>
<body>
    
</body>
</html>
  • Number : typeof instance === 'number'
  • Number 타입은 모두 실수로 처리됨

 

1-2. String type

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        console.log('안녕하세요');
        console.log("안녕하세요");
        console.log(typeof "안녕하세요");   //string
        console.log('안녕하세요'.length);   //5
        let val = '대한민국';
        console.log(val.length);            //4
        console.log(val[1]);                //한
        let val1 = '아름다운';
        let val2 = val1 + ' ' + val;
        console.log(val2);                  //아름다운 대한민국
        let val3 = 'This is "string"';
        console.log(val3);                  //This is "string"
        let val4 = "This is 'string'";
        console.log(val4);                  //This is 'string'

        //템플릿 문자열
        let num0 = 10;
        let num1 = 3.14;
        let val5 = `${num0}과 ${num1}의 곱은 ${num0*num1}입니다.`;
        console.log(val5);
    </script>
</head>
<body>
    
</body>
</html>
  • String: typeof instance == 'string'
템플릿 문자열이란?
: 문자열에 변수를 포함시킬 때 좀 더 직관적이고 편하게 사용하기 위한 기능
- 문자열을 만들 때 큰따옴표(") 대신 백틱(`) 사용
- 변수를 넣고자 하는 부분에 ${} 키워드를 사용해 변수 넣기
- 장점: 문자열을 나눠서 더하기 기호를 통해 연결할 필요가 없음 👉 가독성이 좋음

 

1-3. Boolean type

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        let val = true;
        console.log(val);
        console.log(typeof val);    //boolean
    </script>
</head>
<body>
    
</body>
</html>
  • Boolean: typeof instance === 'boolean'

 

1-4. undefined

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        let anyVal;
        console.log(anyVal);        //undefined
        console.log(anyVal);        //undefined
    </script>
</head>
<body>
    
</body>
</html>

 

  • undefined: typeof instance === 'undefined'

 

1-5. 그 외

  • BigInt: typeof instance === 'bigint'
  • Symbol: typeof instance === 'symbol'

 

2. Structural Type

  • Object: typeof instance === 'object'
  • Functino: typeof instance === 'function'

 

3. Structural Root Primitive

  • null: typeof instance === 'object'
728x90