데이터 타입(data type)이란?

프로그래밍 언어에서 여러 종류의 데이터를 식별하는 분류를 말한다.
즉, 변수에 저장되는 값의 종류

• 데이터를 종류에 따라 분류하여 저장하기 위해 데이터 타입 필요
• 자료형 또는 데이터 타입이라 불림

데이터 타입의 종류

1. 기본 타입(원시 타입: Primitive Type)

변경 불가능한 값으로 객체를 제외한 모든 타입은 불변 값을 정의할 수 있다.

숫자(number)

• ECMAScript는 Number와 BigInt 두 가지의 내장 숫자 타입을 가지고 있다
• JS는 모든 수를 실수로 처리한다.
• 메모리에 64비트 부동소수점 형식의 2진수로 저장한다
• 메모리에 있는 어떤 형식의 값을 참조하든지 모두 10진수로 해석한다
• 숫자 외에 추가로 특별한 값 3가지를 가지고 있음
  • Infinity: 양의 무한대
  • Infinity: 음의 무한대
  • NaN: 산술 연산 불가 (not-a-number)

문자열(string)

• 0개 이상의 16비트 유니코드 문자(UTF-16)의 집합으로 전 세계 대부분의 문자를 표현할 수 있다.
• JS의 문자열은 원시타입이며, 변경 불가능한 값이다.
• 작은따옴표(''), 큰따옴표(""), 템플릿 리터럴(``)으로 문자열을 할당할 수 있다.
• ES6부터 도입된 템플릿 리터럴을 이용하면, 줄바꿈이나 공백이 모두 적용된다.

불리언(boolean)

• true or false

undefined

• undefined 타입의 값은 undefined가 유일하다.
• 개발자가 의도적으로 할당하기 위한 값이 아니라, 자바스크립트 엔진이 변수를 초기화할 때 사용하는 값이다.
• 변수를 참조했을 때 undefined가 반환된다면, 참조한 변수가 선언 이후 값이 할당된 적이 없는, 초기화되지 않는 변수이다

null

• null 하나의 값만 가질 수 있다.
• 변수에 null을 할당하는 것은 변수가 이전에 할당되어 있던 값에 대한 참조를 명시적으로 제거
• 변수에 이전 참조값을 더이상 참조하지 않겠다는 의미
• 함수가 유효한 값을 반환할 수 없는 경우 명시적으로 null을 반환함

심벌(symbol)

• ES6부터 새로 생긴 데이터 타입
• 변경불가능한 유일한 값을 생성할 때 사용하며, 값 자체의 확인이 불가하여 외부로 노출되지 않는다.
• 다른 값과 중복되지 않는 유일한 값이다
• Symbol 함수를 호출함으로써 생성할 수 있다.
  다른 타입들과 다른 점은 new 연산자를 이용한 래퍼 객체의 생성이 불가능하다.

  //에러
  const sym = new Symbol();// Uncaught TypeError: Symbol is not a constructor
  //const sym1 = Symbol()
  var sym_01 = Symbol('key');
  console.log(typeof sym_01); // symbol

템플릿 리터럴

• ES6에 도입된 새로운 문자열 표기법으로, 런타임에 일반 문자열로 변환되어 처리된다
• 백틱을 통해 문자열을 생성한다
• 줄바꿈, 표현식 삽입${ }의 기능을 한다

2. 참조 타입(객체 타입: Object/Reference Type)

원시타입을 제외한 모든 것은 객체타입이며 변경가능한 값이다.

• 데이터 크기가 정해져 있지 않다
• 변수에 할당될 때 값이 직접 해당 변수에 저장되는 것이 아니라 , 변수의 값이 저장된 힙 메모리의 주소값을 저장한다.
• 변수가 가지고 있는 메모리 주소를 이용해 변수의 값에 접근한다.
• 주소값을 참조하기 때문에, 원본 데이터의 값이 바뀌면 복사한 데이터의 값도 변경된다.

• 객체, 배열, 함수, 정규표현식도 모두 객체다.

데이터 타입의 필요성

1. 값을 저장할 때 확보해야하는 메모리 공간의 크기 결정

• 메모리에 값을 저장하려면 먼저 확보해야 할 메모리 공간의 크기를 결정해야한다.
• 값의 데이터 타입에 따라 확보해야 할 메모리 공간의 크기가 결정된다.

2. 값을 참조할 때 한번에 읽어 들여야 할 메모리 공간의 크기를 알기 위해

• 값을 참조할 때도 한번에 읽어 들여야 할 메모리 공간의 크기. 즉, 메모리 셀의 갯수(바이트)를 알아야한다.
• 컴파일러 또는 인터프리터는 심벌 테이블이라고 부르는 자료 구조를 통해 식별자를 키로 바인딩된 값의 메모리 주소, 데이타 타입, 스코프 등을 관리 한다.

3. 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

• 모든 값은 2진수. 즉, 비트의 나열로 저장된다.
• 값은 데이터 타입에 따라 다르게 해석될 수 있다.

정적 타이핑

변수를 선언할 때 변수에 할당할 수 있는 값의 종류, 데이터타입을 사전에 정의한다.

• 시점: 변수선언시점 변수의 타입결정
• 타입변경: 변수의 타입을 변경 하지 못함, 미리 변수에 선언한 타입에 맞는 값만 할당 가능하다
• 컴파일언어가 많다 (C, C++, JAVA, Kotilin, Go, Haskell, Rust, Scala)
  • 컴파일 시점에 타입 체크한다 : 선언한 데이터타입에 맞는 값을 할당했는지 검사 ➡️ 에러발생 ➡️ 프로그램실행 막음
• javascript를 정적으로 사용하기위해선 typescript 사용 TypeScript, C, Java, C++, C#

동적 타이핑

변수에 할당되어 있는 값에 의해 변수의 타입이 동적으로 결정된다.
유연성⬆️ 신뢰성⬇️

• 시점: 값을 할당하는 시점에 변수의 타입이 동적으로 결정된다. (변수를 선언할 때 타입을 선언하지 않음)
  값이 타입을 가짐! 그리고 그 값이 변수에 할당된 !
• 타입변경: 타입을 언제든지 변경 가능하다. 재할당에 의해 변수의 타입은 언제든지 동적으로 변할 수 있다.
• 인터프리터언어가 많다 (JavaScript, Pyton, PHP, Ruby, Lisp, Perl)
• javascript는 동적타이핑! Python, Ruby, Javascript

정적 타이핑과 동적 타이핑의 차이

• 타입 선업 시점
• 타입추론
• 재할당 가능여부
• 에러발생 시점

*동적 타입
- 변수의 타입 선언 없이 값을 할당.
- 변수에 값이 할당되는 과정에서 동적으로 타입을 추론.
- 변수의 타입 결정 이후에도 같은 변수에 여러 타입의 값을 교차하여 할당 가능.
- 사용이 간편하지만 코드 예측이 어려워 예상치 못한 오류 발생 가능성이 있음
*정적 타입
- 타입을 명시적으로 선언.
- 타입 결정 이후에는 타입 변경 불가능.
- 잘못된 타입의 값이 할당되면 에러 발생.

타입변환과 단축 평가

타입변환

개발자의 의도와 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 타입이 자동 변환되는 것
=> 타입변경

명시적 타입변환

• 개발자의 의도에 따라 명시적으로 타입을 변경하는 방법
  • 표준 빌트인 생성자 함수를 new 연산자 없이 호출하는 방법. String(), Number(), Boolean()
  • 빌트인 메서드를 사용하는 방법
  • 암묵적 타입 변환을 이용하는 방법

암묵적 타입변환

• 자바스크립트 엔진이 표현식을 평가할 때, 개발자의 의도와 상관없이 코드의 문맥을 고려해 암묵적으로 데이터 타입을 강제 변환 하는것
  • 문자열 타입으로 변환
  • 숫자 타입으로 변환
  • 불리언 타입으로 변환

단축평가

표현식을 평가하는 도중에 평가 결과가 확정된 경우 나머지 평가 과정을 생략하는 것
=> 타입변경 x

논리 연산자를 사용한 단축평가

• 논리곱&&
  두 개의 피연산자가 모두 true로 평가될 때 true를 반환.
  좌항에서 우항으로 평가가 진행.

• 논리합||
  두 개의 피연산자 중 하나만 true로 평가되어도 true를 반환.

'cat' || 'dog'   // cat
false || 'dog'   // dog
'cat' || false   // cat

'cat' && 'dog'   // dog
false && 'dog'   // false
'cat' && false   // false

옵셔널 체이닝 연산자

• ES11에서 도입된 옵셔널 체이닝 연산자 ?
• 좌항의 피연산자가 null 또는 undefined인 경우 undefined를 반환하고,
• 그렇지 않으면 우항의 프로퍼티 참조를 이어간다.

var elem = null;
var value = elem?.value;
console.log(value);   

null 병합 연산자

• ES11(ECMAScript2020)에 도입된 null 병합 연산자 ??
• 좌항의 피연산자 null 또는 undefined인 경우 우항의 피연산자를 반환하고,
• 그렇지 않으면 좌항의 피연산자를 반환한다.
• null 병합 연산자 ??는 변수에 기본값을 설정할 때 유용하다.

var foo = null ?? 'default string'
console.log(foo);        // "default string"

동적, 정적 타이핑
동적, 정적 타이핑 차이
타입변환과 단축평가
JS vs TS