Front-end/Typescript

Typescript에서 변수 선언하기

아지송아지 2022. 2. 19. 10:07

오늘은 typescript에서 변수를 선언하는 방법에 대하여 알아보겠습니다.

js와 달리 ts는 타입이 엄격하기 때문에 유의하셔야 합니다.

 

숫자 . number

숫자를 선언합니다.

16진수, 10진수, 8진수, 2진수 모두 지원합니다.

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

 

문자열 . string

문자열을 선언합니다.

백틱(``)을 사용하거나 연산이 있는 문자열도 가능합니다.

let hello: string = "hello";

let sentence: string = `${hello} my name is sjh`;
let sentence2: string = hello + "my name is sjh";

 

진위값 . boolean

true/false값을 선언합니다.

let isGood: boolean = true;

 

배열 . Array

배열을 선언합니다.

배열 안에 어떤 타입이 들어가는지도 정해주어야 합니다.

두 가지 선언하는 방법이 있습니다.

1. 타입 뒤에 []를 쓰는 것

let arr: number[] = [1, 2, 3];

2. 제네릭 배열 타입 Array<elemType>

let arr: Array<number> = [1, 2, 3];

 

튜플 Tuple

튜플 타입을 사용하면 요소의 타입과 개수가 고정된 배열을 표현할 수 있습니다.

// 튜플 타입 선언
let arr:[string, number];
// 초기화
arr = ["hello", 123];
// 잘못된 초기화 (순서가 잘못됐다.)
arr = ["hello", 123];

정해진 인덱스 타입에 맞는 함수를 사용해야 합니다.

다른 인덱스에 접근하면 오류가 납니다.

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

arr[3] = "hi"; // 튜플로 두 개만 선언하였다.

 

열거 . Enum

이넘은 특정 값들의 집합을 의미하는 자료형입니다.

아래와 같이 별도의 값을 지정해주지 않으면 숫자형 이넘으로 취급합니다.

그다음 값들은 1씩 증가합니다.

enum Shoes{
    Nike,
    Adidas
}

const nikeShoes = Shoes.Nike;
const adidasShoes = Shoes.Adidas
console.log(nikeShoes); // 0
console.log(adidasShoes); // 1

 

초기값을 지정해주면 해당하는 숫자부터 1씩 증가합니다.

index로 해당 순서가 어떤 값이지 찾을 수 있습니다.

enum Alphabet{
    A = 1,
    B,
    C = 10,
    D,
    E = 0,
    F
}

const a = Alphabet.A;
const b = Alphabet.B;
const c = Alphabet.C;
const d = Alphabet.D;
const e = Alphabet.E;
const f = Alphabet.F;
console.log(Alphabet[10]) // C
console.log(Alphabet[2]) // B
console.log(a, b, c, d, e, f); // 1, 2, 10, 11, 0, 1

 

Any

타입을 알지 못할 때 사용합니다.

let anyType: any = "hello";
anyType = false;
anyType = 0;

 

Null, Undefined

null 혹은 undefined 를 사용할 때는 자신의 이름 타입 그대로 사용합니다.

let u: undefined = undefined;
let n: null = null;

 

Object

원시 타입이 아닌 타입을 나타냅니다.

객체를 생성할 때 사용할 수 있습니다.

function test(obj:object){
    console.log(obj)
}
test({a:1})

 

 

추가/수정해야 할 부분이 있다면 알려주시면 감사하겠습니다.

'Front-end > Typescript' 카테고리의 다른 글

Typescript enum 정리  (0) 2022.02.28
Typescript 유니온, 인터섹션 타입  (0) 2022.02.28
Typescript type alias & interface  (0) 2022.02.24
Typescript에서 함수 선언하기  (0) 2022.02.22
Typescript란 무엇인가  (0) 2022.02.17