자바스크립트는 동적 언어입니다. 정적 언어와 달리 변수를 정의할 때 데이터 타입을 정의할 필요가 없습니다.

var id;

id = 2023;
console.log(typeof id); // number

id = 'ID2023';
console.log(typeof id); // string

id 변수에는 숫자를 넣을 수도 문자를 넣을 수도 있습니다.

자바스크립트는 특정 값이 할당된 변수에 다른 자료형의 값이 넣는 것이 가능하여 편리하고 자유롭지만 그만큼 오류에 취약한 단점을 가지고 있습니다.

데이터 타입과 종류

자바스크립트에는 총 7개의 데이터 타입이 있습니다. 6개는 기본형 타입이고 1개는 참조형 타입으로 객체가 있습니다.

기본형 (원시 자료형)

• string
• number
• boolean
• null
• undefined
• symbol

참조형

• object (배열, 함수, 날짜, 정규표현, Map, Set 등 )

string

let str1 = "텍스트";
let str2 = '텍스트';
let str3 = `백틱을 사용하면 문자열안의 탭과 		줄바꿈도 
그대로 나타내줍니다.`;

let str4 = "큰따옴표 안에 또다른 큰따옴표는 이스케이프 표현 \"으로 대체 가능";

let name = '홍길동';
let str5 = `안녕하세요 저는 ${name} 입니다.`

console.log('가나다' > '라마바'); //false
console.log('100' > 12); //true. 문자열과 숫자를 비교하면 문자열이 숫자가 됨

• 큰따옴표, 작은따옴표, 백틱을 사용하여 문자열을 담습니다.

• 백틱을 사용하면 문자열 안에 탭과 줄바꿈을 그대로 표현해줍니다.

• 템플릿 리터럴: 백틱안에서 ${} 기호를 사용하여 상수나 변수, 표현식 등을 삽입할 수 있습니다.

• 이스케이프 표현

  이스케이프 표현	대체
  \'	작은따옴표
  \"	큰따옴표
  \n	줄바꿈
  \t	탭
  \\	백슬래시

• 문자열에 사용되는 연산자

  연산자	의미
  x == y	값이 같다
  x === y	자료형도 값도 같다. (권장)
  x != y	값이 다르다
  x !== y	자료형 또는 값이 다르다. (권장)
  x < y	사전순서상 x가 먼저 온다.
  x > y	사전순서상 y가 먼저 온다.

number

let int1 = 10;
let int2 = 10.11;
let int3 = -10;

//무한대
let x = 1 / 0;
console.log(x, typeof x); //Infinity, 'number'
console.log(x+1); // Infinity. 무한대에 더하기,빼기를 해도 무한대
console.log(-x); // -Infinity. 무한대에는 양수와 음수가 있음

//NaN
let y = 2 * "글자";
console.log(y, typeof y); //NaN, 'number'
console.log(x == NaN, x === NaN); //false, false. ==과 ===으로는 NaN인지 여부 확인 불가
console.log(isNaN(x)); //숫자가 아닐 시 true
console.log(Number.isNaN(x)) //보다 엄격한 버전

• 정수와 실수를 구분하지 않고 정수도 실수로 처리합니다.
• 정수는 2^53 - 1 까지 안정적으로 표현 가능하며, 더 큰 정수는 BigInt 자료형을 사용해야 합니다.
• 무한대는 Infinity 값으로 나타냅니다.
• 숫자가 아닌 것이라는 'Not a Number'를 나타내는 NaN 값이 있습니다.
• 산술 연산자로 +, -, *, /, %, **(제곱), ++, -- 을 사용할 수 있습니다.
• 문자열 앞에 +, -기호를 붙이면 숫자로 바뀝니다. 숫자로 바꿀 수 없는 문자열인 경우 NaN을 반환합니다.
• 부동소수점을 사용합니다.

boolean

let boo1 = true;
let boo2 = false;

let boo3 = 1 > 2;

let boo4 = true && true; //true
let boo5 = true && false; //false
let boo6 = false && false; //false

let boo7 = true || true; //true
let boo8 = true || false; //true
let boo9 = false || false; //false

• 참 또는 거짓의 값을 담습니다.
• 비교 연산자의 결과를 boolean으로 반환합니다.
• &&와 ||를 이용할 때, 단축평가가 이루어집니다. 연산 부하가 적은 코드를 앞에 배치하면 좋습니다.
  • &&: 앞의 것이 false이면 뒤의 것을 평가할 필요가 없음
  • ||: 앞의 것이 true이면 뒤의 것을 평가할 필요가 없음

undefined

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

x ?? console.log('x는 null 또는 undefined입니다.')

• 아직 값이 할당되지 않은 상태를 의미합니다.
• 아무 것도 return하는 값이 없을 때 undefined를 반환해줍니다.
• null 병합 연산자인 ??에서 사용할 수 있습니다.

null

let x = null;

x ?? console.log('x는 null 또는 undefined입니다.')

• 의도적으로 비어있는 값을 할당합니다.
• 주로 변수에 값이 할당되는 것이 실패할 경우 또는 준비되지 않은 경우를 대비해서, 대신 반환하는 용도로 많이 쓰입니다.
• null 병합 연산자인 ??에서 사용할 수 있습니다.

object

const obj1 = {
  name: '홍길동',
  age: 20,
};

console.log(typeof obj1); //object

• 원시 타입이 아닌 모든 데이터는 근본적으로 객체입니다.
• 복합적인 정보를 프로퍼티(키와 값의 조합)로 저장합니다.