[TS] 기본 타입

Jin·2022년 2월 3일
0

TypeScript

목록 보기
1/1
post-thumbnail

기본 타입

Boolean

let isDone : boolean = false;

Number

JS처럼, TS의 모든 숫자는 부동 소수 값이다. 16진수, 10진수, 2진수, 8진수 리터럴도 지원한다

let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number - 0o744;

String

" 큰 따옴 표 ' 작은 따옴표 둘다 사용 가능하고 백틱 ` 또한 사용 가능하며 ${} 와 같은 형태로 표현식을 포함 할 수 있다.

let color: string = "blue";
color = 'red'

let fullName: string = `Bob Bobbington`;
let age: number = 37;
let sentence: string = `Hello, my name is ${fullname}. I'll be ${age+1} years old next month.`

Array

배열 타입은 두 가지 방법으로 쓸 수 있다. 첫번째 방법은, 배열 요소들을 나타내는 타입 뒤에 [] 를 쓰는것이고, 두번째는 제네릭 배열 타입을 쓰는 것이다.

// 첫번째 방법
let list: number[] = [1,2,3];

// 제네릭
let list:Array<number> = [1,2,3];

Tuple

튜플 타입을 사용하면, 요소의 타입과 개수가 고정된 배열을 표현 할 수 있다. 단 요소들 타입이 모두 같을 필요는 없다.

// tuple 타입으로 선언
let x:[string, number];

// 초기화
x = ['hello', 10] // 성공

// 잘못된 초기화
x = [10, 'hello'] // 오류

console.log(x[0].substring(1)) // 성공
console.log(x[1].substring(1)) // 오류, 'number'에는 'substring'이 없다.

x[3] = 'world'; // 오류, '[string, number]' 타입에는 프로퍼티 3이 없다.

열거 Enum

JS의 표준 자료형 집합과 사용하면 도움이 될만한 데이터 형이다.

enum Color {Red, Green, Blue}
let c:Color = Color.Green;

기본적으로, enum 은 0부터 시작하여 멤버들의 번호를 매긴다. 멤버 중 하나의 값을 수동으로 설정하여 바꿀수 있다. 모든 값을 수동으로 설정할 수도 있다.

enum Color {Red=1, Green, Blue}
let c: Color = Color.Green;

// 모든 값을 수동으로 설정
enum Color {Red=1, Green=2, Blue=4}

let c: Color = Color.Green;

enum 의 유용한 기능 중 하나는 매겨진 값을 사용해 enum 멤버의 이름을 알아 낼수 있다는것이다.

예를들어, 위 예제에서 2의 값이 위의 어떤 Color enum 멤버와 매칭되는지 알 수 없을 때, 이에 일치하는 이름을 알아 낼 수 있다

enum Color {Red=1, Green, Blue}
let colorName: string = Color[2]

console.log(colorName) // Green

또한 문자열도 입력이 가능하다.

enum을 쓰게 되면 타입이 보장되지 않는다. 또한 union type으로 enum을 대체 가능하기에 enum을 자주 사용하지 않는다.

enum Alphabet {
  a = 2,
  b,
  c,
  d,
  e = 'hi',
  f = 'bye',
  g = 'good'
}

let letter = Alphabet.f;

Any

알지 못하는 타입을 표현할때 사용 가능하다.

any 타입은 기존에 JS로 작업할 수 있는 강력한 방법으로, 컴파일 중에 타입검사를 하거나 하지 않을 수가 있다.

let notSure: any = 4;
notSure = 'maybe a string instead'
notSure = false; // 성공

Void

어떤 타입도 존재 할 수 없음을 나타낸다. 보통 함수에서 반환 값이 없을때 반환 타입을 표현하기 위해 쓰인다.

function warnUser(): void {
  console.log('This is test')
}

void를 사용하면 undefined만 입력할수있기 때문에 void를 사용하는것은 유용하지 않다.

Null and Undefined

void 와 마찬가지로 그 자체로 유용한 경우는 거의 없다.

기본적으로 nullundefined 는 다른 모든 타입의 하위 타입이다. null과 undefined를 number 같은 타입에 할당할 수 있다는것을 의미한다.

Never

never 타입은 절대 발생할 수 없는 타입을 나타낸다. 예를 들어, never 는 함수 표현식이나 화살표 함수 표현식에서 항상 오류를 발생시키거나 절대 반환하지 않는 반환 타입으로 쓴다.

never 타입은 모든 타입에 할당 가능한 하위 타입이다. 하지만 어떤 타입도 never 에 할당할 수 있거나, 하위 타입이 아니다. anynever 에 할당할 수 없다.

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function error(message: string): never {
  throw new Error(message);
}

// 반환 타입이 never로 추론된다.
function fail() {
	return error('Somthing failed')
}

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function infiniteLoop(): never {
	while (true) {
	}
}

Object

object 는 원시 타입이 아닌 타입을 나타낸다. 예를 들어, number, string, boolean,bigint, symbol, null, undefined가 아닌 나머지를 의미한다.

declare function create(o: object | null): void;

create({ prop: 0 }); // 성공
create(null); // 성공

create(42); // 오류
create("string"); // 오류
create(false); // 오류
create(undefined); // 오류

타입 단언 (Type assertions)

타입 단언은 컴파일러에게 "날 믿어, 난 내가 뭘하고 있는지 알아"라고 말해주는 방법이다. 다른 언어의 타입 변환과 유사하지만, 다른 특별한 검사를 하거나 데이터를 재구성하지는 않는다. 이는 런타임에 영향을 미치지 않으며, 온전히 컴파일러만 이를 사용한다.

타입 단언에는 두가지 형태가 있다.

// 1. angle-bracket 문법

let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;

// 2. as 문법

let someValue: any = 'This is a string'
let strLength: number =(someValue as string).length;

위의 두 방법은 동일하지만, TypeScript를 JSX와 함께 사용할 때는 as 스타일만 허용된다.

자료 출처 : https://typescript-kr.github.io

profile
내가 다시 볼려고 작성하는 블로그. 아직 열심히 공부중입니다 잘못된 내용이 있으면 댓글로 지적 부탁드립니다.

0개의 댓글