💫TS:: ✨ 배열과 튜플, 언제 튜플을 사용해야 할까?

✨Array와 Tuple

🔷 Array

✔️ Array 예제1

let list: number[] = [1, 2, 3];
let list: Array<number> = [1, 2, 3];

✔️ Array 예제2

// Array
const fruits: string[] = ["🍅", "🍌"];
const scroes: Array<number> = [1, 3, 4]; // number[] = [1, 2, 3];

function printArray(fruits: readonly string[]) {
  // readonly 라는 키워드는 말 그대로 읽기 전용
  // object의 불변성을 지키는 것은 매우 중요하므로, readonly가 많이 사용 됨
}

---

🔷 Tuple

Tuple은 배열은 배열인데 서로 다른 타입을 가질 수 있는 배열

✔️ Tuple 예제1

// Declare a tuple type
let x: [string, number];

// Initialize it
x = ["hello", 10]; // OK

// Initialize it incorrectly
x = [10, "hello"]; // 💩Error

✔️ Tuple 예제2

Tuple을 사용하는 곳이라면 interface, type alias, class 등으로 대체해서 사용하는 것을 추천!

• Tuple에 접근할 때엔, index로 접근이 가능한데 이러면 어떤 데이터가 들어있는지 바로 확인이 어려우므로 가독성 ⬇️ ➡️ 이런 경우 구조 분해 할당를 활용하자!

let student: [string, number];
student = ["name", 123];
student[0]; // name
student[1]; // 123
const [name, age] = student; // 구조 분해 할당 Destructuring

✔️ Tuple 예제3 useState()

useState(): 첫 번째와 두 번째의 타입이 다르다. 두 번째는 함수형

const [num, setNum] = useState(null);