TypeScript) Array와 Tuple

Songss·2025년 1월 13일

TypeScript

목록 보기
6/10

Array 배열


let numbers: number[] = [1, 2, 3, 4, 5, 6, 7, 8];
let strings: string[] = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];

for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}

for (let i = 0; i < strings.length; i++) {
  console.log(strings[i]);
}

: number : string 데이터 타입 뒤에 [] 기호를 붙여주면 배열로 선언된다.

배열의 union 타입

let mixedArray: (number | string)[] = [1, 'two', 3, 'four'];

for (let i = 0; i < mixedArray.length; i++) {
  console.log(mixedArray[i]);
}

2개 이상의 데이터 타입을 선언하려면 () 을 사용해야한다.

위 코드 처럼 : (number | stirng)[] 사용하게 되면

숫자형(number), 문자형(string)타입일 수 있는 배열을 선언할 수 있다.

Tuple : 타입의 순서가 정해져 있다.

자바스크립트에는 없는 타입이라고 합니다.

let greeting: [number, string, boolean] = [1, 'hello', true];

for (let i = 0; i < greeting.length; i++) {
  console.log(greeting[i]);
}

TypeScript에서 튜플(Tuple)배열(Array)은 모두 값의 집합을 나타내는 데 사용되지만, 두 개념에는 중요한 차이가 있습니다.


1. 튜플 (Tuple)

튜플은 고정된 길이와 각 위치의 타입이 명확히 지정된 배열입니다.

  • 특징:
    1. 길이가 고정되어 있습니다.
    2. 각 요소의 타입이 위치에 따라 다를 수 있습니다.
    3. 컴파일 타임에 각 위치의 타입을 명확히 검증할 수 있습니다.
  • 사용 예:
let user: [string, number]; // 튜플 선언

user = ['John', 25]; // 올바른 초기화
// user = [25, 'John']; // 오류: 위치에 따라 타입이 달라야 함
// user = ['John'];     // 오류: 길이가 고정되어 있어야 함

2. 배열 (Array)

배열은 동일한 타입의 값들을 가변적인 길이로 저장하는 구조입니다.

  • 특징:
    1. 길이가 가변적입니다.
    2. 모든 요소의 타입이 동일해야 합니다.
    3. 배열의 길이나 특정 위치의 타입은 컴파일 타임에 고정되지 않습니다.
  • 사용 예:
let numbers: number[] = [1, 2, 3, 4]; // 숫자 배열
numbers.push(5); // 배열의 길이를 자유롭게 변경 가능

// numbers.push('hello'); // 오류: 문자열은 숫자 배열에 추가할 수 없음

주요 차이점

특성튜플 (Tuple)배열 (Array)
길이고정가변적
요소 타입각 위치의 타입이 다를 수 있음모든 요소가 동일한 타입
사용 목적정해진 구조의 데이터를 표현 (예: 좌표)동일한 타입의 값 목록을 다룰 때 사용
런타임 검사길이 및 위치 타입이 컴파일 타임에 검사길이 제한이 없으며 동적 처리 가능

튜플과 배열의 비교 예제

// 튜플
let point: [number, number] = [10, 20]; // x, y 좌표
// point = [10, '20']; // 오류: 두 번째 요소는 number여야 함
// point.push(30); // 일부 예외적으로 push는 허용되지만 타입은 보장되지 않음

// 배열
let points: number[] = [10, 20, 30, 40]; // 여러 좌표
points.push(50); // 추가 가능
// points.push('hello'); // 오류: 문자열은 허용되지 않음

선택 기준

  1. 튜플은 요소의 위치별 타입이 중요한 경우 사용 (예: 좌표, 반환값 등).
  2. 배열은 동일한 타입의 데이터를 가변적으로 관리할 때 사용.

Spread 연산자

let firstArray = [1,2,3];
let secondArray = [4,5,6];

let combineArray = [...firstArray, ...secondArray];

for(let i = 0; i < combineArray.lenth; i++){
	console.log(combineArray[i];
}

// 1
// 2
// 3
// 4
// 5
// 6

0개의 댓글