[TS] 배열 타입 정의 방법, 객체 타입 정의 방법

배열 타입 정의 방법

1️⃣ : 배열요소타입[]

• let numArr: number[] = [1, 2, 3]

 

2️⃣ : Array<배열요소타입>

• 제네릭을 이용한 방식
• let stringArr: Array<string> = ["hello", "summer", "hot"]

 

다양한 타입 요소를 갖는 배열 타입 정의하기 

바|를 이용해 유니온(union) 타입을 설정합니다. 

• let multiArr: (number | string)[] = [1, "hello"]
• 배열에 number 혹은 string 타입이 들어올 수 있음을 의미합니다.

 

다차원 배열 타입 정의하기 

[]을 연달아 적어서 다차원 배열의 타입도 정의할 수 있습니다. 

let doubleArr : number[][] = [
  [1, 2, 3], 
  [4, 5]
]

 

 

튜플 Tuple

길이와 타입이 고정된 배열을 의미합니다. 타입스크립트의 특수한 타입입니다. 

길이가 2로 고정된 2개의 string 타입 요소를 같은 튜플 타입은 아래와 같이 정의합니다. 

let tup1: [number, number] = [1, 2];

 

첫 번째 요소가 number,  두 번째 요소가 string, 세 번째 요소가 boolean인 길이가 3으로 고정된 배열을 만들고 싶다면 아래와 같이 정의합니다. 

let tup2: [number, string, boolean] = [1, "hello", true];

 

튜플도 결국 배열이기 때문에 push나 pop을 이용할 수 있습니다.

 

const users = [
  ["하나", 1], 
  ["둘", 2], 
  ["셋", 3], 
  ["넷", 4]
]

 

위와 같은 예시가 있다고 할 때[5, "다섯"] 요소로 잘 못 넣었다고 할 때 튜플을 사용한다면 오류가 발생하게 되어 실수를 쉽게 바로 잡을 수 있습니다. 

 

const users: [string, number][] = [
  ["하나", 1], 
  ["둘", 2], 
  ["셋", 3], 
  ["넷", 4],
  [5, "다섯"] // error
]

 

 

객체 타입 정의 방법

1️⃣  Object로 정의하기

객체의 속성을 이용하지 않는다면 간단하게 타입 주석을 이용해서 object라고 정의해 주면 된다. 

 

let user: object = {
  id: 1,
  name: "Ea",
};

 

 

하지만 이 경우에는 객체의 프로퍼티에 접근하려고 하면 object.id, 'object' 타입에 'id' 프로퍼티가 없습니다.라는 에러가 뜹니다. 

객체의 프로퍼티에 대한 정보를 가지고 있지 않아서 입니다. 만약 이처럼 object의 프로퍼티에 접근해야 하는 상황이라면 객체 리터럴 타입을 이용해야 합니다. 

 

 

2️⃣  객체 리터럴 타입으로 정의하기

객체 리터럴 타입은 중괄호를 열고 { ... } 객체가 가지고 있는 프로퍼티를 직접 나열해 만든 타입입니다. 

 

let user: {
  readonly id: number;
  name: string;
  isLoggedIn?: boolean; // 선택적 프로퍼티 
} = {
  id: 1,
  name: "Ea",
  isLoggedIn: true
};

user.id;

 

 

객체 리터럴 타입을 이용하면 객체를 프로퍼티를 이용해도 에러를 발생시키지 않게 됩니다. 

readonly를 사용하게 되면 해당 속성은 읽기 전용 프로퍼티가 되며 프로퍼티의 값을 수정하려고 하면 오류가 발생합니다. 

 

따라서 객체의 타입을 정의할 때에는 Object 보다 객체 리터럴 타입을 사용하는 것이 사용하는 것이 좋습니다.