[TypeScript] 타입스크립트 변수

1. 변수

const phone: string = "010-1234-5678";
const num: number = 10;
const isEnable: boolean = true;

 

변수명 : 타입

형식입니다

function message(msg: string): void {
  console.log(msg);
}
message("test");

 

함수의 반환값도 마찬가지로 

함수명 뒤에 : 타입

입니다

 

함수의 타입에 맞게 파라미터를 넘겨주지 않으면 에러가 발생합니다.

넘겨줄 수도 있고 아닐 수도 있을 땐 선택 속성을 사용합니다.

1-1 선택 속성

function message(msg: string): void {
  console.log(msg);
}
message();
// 에러 발생

function message(msg?: string): void {
  console.log(msg);
}
message();
// undefined 출력

 

선택 속성은 변수명 뒤에 ? 를 붙여서 만들 수 있습니다.

 

1-2 변수 타입

null	값이 없음
undefined	값이 할당되지 않은 상태
boolean	true or false
string	문자열
number	숫자
bigint	매우 큰 숫자 타입, n을 붙여야 함
symbol	불변, 유니크한 값

 

// 숫자
const no: number = 1;
// 문자열
const text: string = "test";
// boolean
const isEnable: boolean = true;
// undefined
const ud: undefined = undefined;
// null
const nl: null = null;
// bigint
const bi: bigint = 123n; // 작은 수도 됩니다
// symbol
const sb: symbol = Symbol("symbol");

// 객체
const obj: { name: string; age: number } = {
  name: "test",
  age: 20
}

 

1-3 타입 계층과 특징

 

 

null

 

 

 

unknown

any

void

undefined

 

never

 

 

number

Number Enum

 

 

 

 

bigint

 

 

 

 

 

boolean

 

 

 

 

 

string

String Enum

 

 

 

 

symbol

Unique Symbol

 

 

 

 

object

Array

Tuple

 

 

 

 

Function

 

 

 

 

 

Constructor

 

 

최상위 타입
unknown

 

모든 타입의 슈퍼타입.

즉, 모든 타입은 unknown에 할당될 수 있습니다.

let value: unknown;
value = "hello";
value = 123;
// value.toUpperCase(); // ❌ 오류: unknown은 직접 사용할 수 없음

if (typeof value === "string") {
  console.log(value.toUpperCase()); // ✅ 타입 가드 후 사용 가능
}

 

하지만 unknown 타입의 값은 어떤 타입의 변수에도 저장할 수 없습니다.

연산도 안 되고 메서드도 사용할 수 없습니다.

let num: number = 10;

let uk: unknown;
uk = 10;
uk = "a";

num = uk; // 에러

any

 

any는 타입 검사를 건너뛰는 특수 타입.

어떤 타입이든 할당 가능하며, 어떤 타입에도 할당될 수 있습니다.

let anything: any = "hello";
anything = 123;
anything.toFixed(); // ✅ 가능하지만, 타입 검사 없음 (위험)

 

object

 

const obj: object = { 
  name: "Alice", 
  age: 20 
};

const obj: { name: string; age: number } = {
  name: "Alice",
  age: 20
}

// 둘의 차이는?

 

object는 가장 포괄적인 객체 타입

객체라는 것만 알 수 있고, 속성에 접근할 수 없습니다.

console.log(obj.name); // ❌ 오류: 'object' 타입에 'name' 속성이 없음

 

1-3-1. 읽기전용 프로퍼티

readonly를 붙이면 읽기전용으로 만들 수 있습니다.

 

const obj: { readonly name: string; } = {
  name: "a"
};
obj.name = "b"; // 오류