[Javascript] 데이터 타입(data type)

📕 Javascript의 데이터 타입과 형 변환

✅ Data type의 결정
: runtime (run 하는 time) 에 결정
= 코드를 작성할 때가 아닌, 실제 코드가 실행될 때
= 옆에 터미널에 코드가 실행될 때 ▶️ 그때 데이터 타입이 결정된다.

ex)
<java> : String a ="abc"; // 이렇게 data type : String임을 표시해야함.
<javascript> : const a = "abc"; // 변수만 선언

 

1. Javascript의 데이터 타입(data type)

1) 숫자(number)

1️⃣ 정수 (int)

let num1 = 10;
console.log(num1); // 10
console.log(typeof num1); // number

2️⃣ 실수(float)

let num2 = 3.14;
console.log(num2); // 3.14
console.log(typeof num2); // number

3️⃣ 지수형 (exp)

let num3 = 2.5e5;
console.log(num3); // 250,000
console.log(typeof num3); // number

4️⃣ Nan : Not a Number

let num4 = "Hello" /2; 
console.log(num4); // Nan

5️⃣ Infinity(무한대)

let num5 = 1 / 0;
console.log(num5); // Infinity
console.log(typeof num5); // number

6️⃣ Minus Infinity(마이너스 무한대)

let num6 = -1 / 0;
console.log(num6); // Minus Infinity
console.log(typeof num6); // number

2) 문자열 (string)

📌 String (문자열 = 문자의 나열)

: ' ' = " " (작은 따옴표 또는 큰 따옴표)

let str = "Hello World!";
console.log(str); // Hello World!
console.log(typeof str); // String

1️⃣ 문자열 길이 확인하기 : length

console.log(str.length); // 12

2️⃣ 문자열 결합하기 : concat (Concaternation)

let str1 = "Hello, ";
let str2 = "World!";
let result = str1.concat(str2) 
console.log(result); // Hello, World!

3️⃣ 문자열 자르기 : substr, slice

• substr(from : number(자르기 시작하는 숫자), length : number(자르는 문자열 몇 개))
• slice(starting number, end number)

let str3 = "Hello, World"
console.log(str3.substr(7,5)); // World
console.log(str3.slice(7, 12)); // World

4️⃣ 문자열 검색 : search

let str4 ="Hello, World";
console.log(str4.search("World")); // 7

5️⃣ 문자열 대체 : replace

let str5 = "Hello World!";
let result01 = str.replace("World", "Javascript");
console.log(result01); // Hello Javascript!

6️⃣ 문자열 분할 : split

let str6 = "apple, banana, kiwi";
let result02 = str6.split(",");
console.log(result02);    // ['apple', 'banana', 'kiwi'] : 문자열이  분할 되어 "배열" 형태로 나타난다!!

3) 불리언(Boolean)

📌 불리언(Boolean)
: true(참) 또는 false(거짓)

let bool1 = true; // "true"라고 쓰면 문자열이 되므로 조심!
let bool2 = false;

console.log(bool1); // true
console.log(typeof bool1); // boolean
console.log(bool2); // false
console.log(typeof bool2); // boolean

▶️ if : 만약 ~ 한다면! (조건문에서 Boolean type 많이 사용)

4) undefined

: 값이 할당되지 않은 변수 (un : not, define : 정의하다)

let x;
console.log(x); // undefined

5) null

: 값이 존재하지 않음을 '명시적'으로 나타내는 방법
(개발자가 의도적으로 값을 지정하지 않은 것)

• null 과 undefined은 다르다!

let y = null;
console.log(y); // null

6) object(객체) : { }

: key-value(data type 아무거나 가능) pair 를 기억

let person ={
    name : 'kim', 
    age : 25,
    isMarried : false
};
console.log(typeof person); // object

7) array (배열) : [ ]

: 여러 개의 데이터를 순서대로 저장하는 데이터 타입

- 배열은 하나하나 순서를 가지고 있으며, index를 가진다
- index을 가진다! = (첫 번째 : [0]/ 두 번째 : [1])과 같이 본인 위치에 대한 데이터를 가지고 있다.

let number = [1,2,3,4,5]; 
let fruits = ['apple', 'banana', 'orange']; 

console.log( number); // [1,2,3,4,5] 
console.log(typeof number); // object 

console.log( fruits); // ['apple', 'banana', 'orange'] 
console.log(typeof fruits); // object`

 

2. 데이터 타입의 형 변환

✅ 데이터 타입의 형 변환
: type의 형태를 바꾼다

• 암시적 형 변환 : 의도하지 않았는데 형태가 바뀐 것
• 명시적 형 변환 : 개발자가 의도적으로 형태를 바뀌는 것

1) 암시적 형 변환

1️⃣ String (문자열)
: 더하기 연산자(+) 로 형 변환 시, 문자열(String)이 우세

let result1 = 1+ "2";
console.log(result1); // 12
console.log(typeof result1); // string
// 숫자 + 문자열 = 문자열로 형 변환

let result2 = "1" + true;
console.log(result2); // 1true
console.log(typeof result2); // string
// 문자열 + 다른 데이터 타입 = 문자열로 형 변환

▶️ {}, null, nudefined + "1" (문자열) → 문자열

2️⃣ Number (숫자)
: 더하기 연산자(+)가 아닌 다른 연산자일때는 숫자(number) 가 항상 우세

let result3 = 1 - "2";
console.log(result3); // -1
console.log(typeof result3); // number

let result4 = "2" * "3";
console.log(result4); // 6
console.log(typeof result4); // number

 

2) 명시적 형 변환

1️⃣ Boolean (불리언)

console.log(Boolean(0)); // false
console.log(Boolean("")); // false
// ▶️ 빈 문자열 -> false 
console.log(Boolean(null)); // false
console.log(Boolean(undefined)); // false
console.log(Boolean(NaN)); // false

console.log(Boolean("false")); // true
// ▶️ 값이 주어지는 문자열 -> true
console.log(Boolean({})); // true
// ▶ 빈 객체 -> true

2️⃣ String (문자열)

let result5=String(123);
console.log(typeof result5); // string
console.log( result5); // 123

let result6=String(true);
console.log(typeof result6); //string
console.log( result6); // true

let result7=String(false);
console.log(typeof result7); //string
console.log( result7); // false

let result8=String(null);
console.log(typeof result8); // string
console.log( result8); // null

let result9=String(undefined); 
console.log(typeof result9); // string
console.log( result9); // nudefined

3️⃣ Number (숫자)

let result10 = Number("123");
console.log(result10); // 123
console.log(typeof result10); // number