타입스크립트 tuple 배열 예제

타입스크립트( Typescript )의 튜플( Tuple )은 배열과 비슷하지만, 각각의 위치에 들어갈 값의 타입과 순서를 미리 정해 두는 자료형 타입이다.
일반적인 배열이 같은 종류의 값을 여러 개 저장하는 데 사용한다면, 튜플은 서로 다른 타입의 값을 일정한 구조로 묶어 사용한다.
튜플 배열은 튜플을 여러 개 저장하는 배열이며, 각 항목은 동일한 위치 구조를 가진다.
첫 번째 위치에는 항상 지정된 타입의 값이 들어가고, 두 번째, 세 번째 위치는 각각 선언된 타입을 따른다.
튜플은 데이터의 구조를 명확하게 표현할 수 있으며, 잘못된 순서나 타입의 값이 저장되는 문제를 컴파일 단계에서 발견할 수 있다.
다만, 데이터 항목의 의미가 많아지거나 필드 수가 증가하는 경우, 각 위치와 항목의 의미를 파악하기 어려워질 수 있기 때문에, 이런 경우에는 이름이 있는 속성을 사용하는 객체나 인터페이스 형태가 더 읽기 쉬울 수 있다.
튜플 배열은 좌표, 키와 값의 조합, 고정된 형식의 간단한 데이터처럼 항목 수가 적고 순서가 명확한 데이터를 반복해서 관리할 때 적합하다.

const user: (string | number)[] = ["홍길동", 20];

⊙

const user: [string, number] = ["홍길동", 20];

⊙

const user: [string, number] = ["홍길동", 20];

⊙

const user: [string, number] = [20, "홍길동"];

⊙

const user: (string | number)[] = ["홍길동", 20];

⊙

const user: (string | number)[] = [20, "홍길동"];

⊙

const user: [string, number] = ["홍길동", 20];

⊙

const users: [number, string][] = [
  [1, "Kim"],
  [2, "Lee"],
  [3, "Park"],
];

⊙

const users: Array<[number, string]> = [
  [1, "Kim"],
  [2, "Lee"],
  [3, "Park"],
];

⊙

type User = [number, string];

const users: User[] = [
  [1, "Kim"],
  [2, "Lee"],
  [3, "Park"],
];

⊙

type User = [id: number, name: string];

⊙

const users: User[] = [
  [1, "Kim"],
  [2, "Lee"],
];

⊙

type User = [number, string];

const user: User = [1, "Kim"];

const [id, name] = user;

console.log(id);
console.log(name);

⊙

type User = [number, string];

const users: User[] = [
  [1, "Kim"],
  [2, "Lee"],
  [3, "Park"],
];

users.forEach(([id, name]) => {
  console.log(id, name);
});

⊙

users.forEach((user) => {
  console.log(user[0], user[1]);
});