배열과 튜플

다음 수업에 오신 것을 환영합니다! 이 수업에서는 TypeScript에서 배열과 튜플을 사용하는 방법을 살펴보겠습니다. 이러한 구조를 사용하면 여러 값을 체계적인 방식으로 저장할 수 있습니다. 시작해 보겠습니다!

배열이란 무엇인가요?

배열은 하나의 변수에 저장된 항목 모음입니다. TypeScript에서는 배열 요소의 타입을 지정할 수 있습니다. 예를 들면 다음과 같습니다.

과제: 좋아하는 숫자로 배열을 만들고 콘솔에 기록해 보세요.

let numbers: number[] = [1, 2, 3, 4, 5];
let names: string[] = ["Alice", "Bob", "Charlie"];
console.log(numbers);
console.log(names);

배열 요소에 접근하기

인덱스를 사용하여 배열의 요소에 접근할 수 있습니다. 배열 인덱스는 0부터 시작한다는 점을 기억하세요.

과제: 배열의 서로 다른 요소에 접근하고 콘솔에 기록해 보세요.

let colors: string[] = ["red", "blue", "green"];
console.log(colors[0]); // Output: "red"
console.log(colors[2]); // Output: "green"

일반적인 배열 메서드

TypeScript 배열에는 유용한 메서드가 많이 있습니다. 몇 가지 예시는 다음과 같습니다.

• push: 배열 끝에 요소를 추가합니다.
• pop: 배열의 마지막 요소를 제거합니다.
• 길이: 배열의 요소 개수를 반환합니다.

예시:

과제: push와 pop 같은 배열 메서드를 사용해 보세요.

let fruits: string[] = ["apple", "banana"];
fruits.push("cherry"); // Add "cherry"
console.log(fruits); // Output: ["apple", "banana", "cherry"]

fruits.pop(); // Remove "cherry"
console.log(fruits); // Output: ["apple", "banana"]

console.log(fruits.length); // Output: 2

튜플이란 무엇인가요?

튜플은 길이가 고정된 배열로, 각 요소의 타입이 서로 다를 수 있습니다. 튜플은 서로 다른 타입의 관련 데이터를 묶을 때 유용합니다. 예를 들면 다음과 같습니다.

과제: 이름과 age로 학생을 나타내는 튜플을 만들어 보세요.

let person: [string, number] = ["Alice", 30];
console.log(person[0]); // Output: "Alice"
console.log(person[1]); // Output: 30

튜플 사용하기

배열과 마찬가지로 튜플도 인덱스 접근과 메서드를 지원합니다. 하지만 구조가 고정되어 있으므로 튜플 타입을 수정하지 않고는 요소를 추가할 수 없습니다. 예를 들면 다음과 같습니다.

과제: 2차원 공간의 점을 나타내는 튜플을 정의하고 값을 기록해 보세요.

let coordinates: [number, number] = [10, 20];
console.log(`X: ${coordinates[0]}, Y: ${coordinates[1]}`);

// Attempting to add an extra element will result in an error
// coordinates.push(30); // Error: Tuple type '[number, number]' of fixed length 2

튜플 배열 사용하기

여러 관련 데이터 항목을 저장하기 위해 튜플의 배열을 만들 수 있습니다. 예를 들면 다음과 같습니다.

과제: 친구들의 이름과 나이를 저장할 튜플 배열을 만들어 보세요.

let students: [string, number][] = [
  ["Alice", 30],
  ["Bob", 25],
  ["Charlie", 35],
];

console.log(students[0]); // Output: ["Alice", 30]
console.log(students[1][1]); // Output: 25

일반적인 실수

배열과 튜플을 사용할 때 흔히 발생하는 실수는 다음과 같습니다.

• 배열의 범위를 벗어난 요소에 접근하는 경우(undefined가 반환됩니다.)
• 배열이나 튜플에 잘못된 데이터 타입을 사용하는 경우(TypeScript에서 오류가 발생합니다.)
• 타입을 업데이트하지 않고 튜플의 구조를 변경하려고 하는 경우

팁: 예상하지 못한 동작을 방지하려면 항상 타입을 명시적으로 지정하세요!

잘하셨습니다!

축하합니다! TypeScript에서 배열과 튜플을 사용해 데이터 모음을 저장하고 관리하는 방법을 배우셨습니다. 배열과 튜플은 프로그램에서 구조화된 정보를 다루는 데 필수적인 도구입니다. 다음 수업에서는 더 복잡한 상황을 처리하기 위한 유니온 타입과 인터섹션 타입을 살펴보겠습니다. 계속 코딩해 봅시다!