[TS] TypeScript 자료형_Primitive Types

 

📘 TypeScript와 JavaScript 비교

Static Types(ts)

set during development

function add(n1: number. n2:number) {
	return n1 + n2;
}

const result = add(39, 28);

 

Dynamic Types(js)

resolved at runtime

function add(n1, n2) {
	if (typeof n1 !== 'number' || typeof n2 !== 'number') {
		throw new Error('Incorrect input!');
	}
	return n1 + n2;
}

const result = add(39, 28);

• 프로그램이 유용하려면, 가장 간단한 데이터 단위로 작업 할 수 있어야 합니다.
  • numbers, string, structures, boolean 값 등등
• TypeScript에서, 우리는 JavaScript에서 기대하는 것과 동일한 타입을 지원하며, 돕기 위해 추가적인 열거타입이 제공되었습니다.

 

ECMAScript 표준에 따른 기본 자료형은 6가지

• TS에서 프로그램 작성을 위해 기본 제공하는 데이터 타입
• 사용자가 만든 타입은 결국은 이 기본 자료형들로 쪼개집니다.
• JS 기본자료형을 포함(superset)
  1. Boolean
  2. Number
  3. String
  4. Null
  5. Undefined
  6. Symbol(ECMAScript 6에 추가)
  7. Array: Object형
• 프로그래밍을 도울 몇가지 타입이 더 제공됩니다.
  • Any, Void, Never, Unknown
  • Enum
  • Tuple : object형

 

 

 

📘 Primitive Types

• 오브젝트와 레퍼런스 형태가 아닌 실제 값을 저장하는 자료형입니다.
• 프리미티브 형의 내장 함수를 사용 가능한 것은 자바스크립트 처리 방식 덕분
• (ES2015 기준) 6가지
  • boolean
  • number
  • string
  • symbol(ES2015)
  • null
  • undefined
• literal 값으로 Primitive 타입의 서브 타입을 나타낼 수 있다.
• true; 'hello'; 3.14; null; undefined;​
• 또는 래퍼 객체로 만들 수 있다.

  new Boolean(false); //typeof new Boolean(false) : 'object'
  new String('world'); //typeof new String('world') : 'object'
  new Number(42); //typeof new Number(42) : 'object'​

 

Type Casing

• Ts 의 핵심 primitive types은 모두 소문자입니다.
• Number, String, Boolean, Symbol 또는 Object 유형이 위에서 권장한 소문자 버전과 동일하다고 생각하고 싶을 수 있습니다.
• 그러나 이러한 유형은 언어 primitives를 나타내지 않으며, 타입으로 사용해서는 안됩니다.

  function reverse(s: String): String {
  	return s.split("").reverse().join("");
  }
  
  reverser("hello world");​

• 대신 number, string, boolean, object and symbol 타입을 사용하십시오.

  function reverse(s: string): string {
  	return s.split("").reverse().join("");
  }
  
  reverse("hello world");​

기본 프로젝트 생성 후 아래 타입 실습!

// package.json 생성
npm init -y

// 개발용으로 TS 설치
npm i typescript -D

// 프로젝트 루트경로에 tsconfig.json 파일이 생긴 것.
npx tsc --init

// tsconfig.json에서 이부분 확인하기.
"strict": true,

// JS로 컴파일
npx tsc

// 파일 실행
noe [파일명]