배열 (Array)

자바스크립트 배열의 문제점

어떠한 값을 넣어도 문제가 되지 않는 것이 문제점이다.

const number = [1, '2', 3, '4', 5];

숫자로 구성된 number 배열을 만들었다. 하지만 임의로 숫자를 문자열로 바꿔도 자바스크립트에서는 전혀 문제가 되지 않는다.

let strings: string[] = ['1', '2', '3'];

타입스크립트는 명시적으로 string 타입만 넣고 싶은 배열을 생성할 수 있다.

타입스크립트에서도 약간의 문제가 있다.

let num: number[] = [1, 2, 3];
let num2 = num[100];

배열의 인덱스 길이보다 큰 인덱스를 가져오면 에러가 발생하지 않는다. 타입스크립트는 인덱스의 길이를 신경쓰지 않는 것이다. 그래서 이런 부분은 에러가 발생할 수 있다.

Spread Operator

스프레드 연산자를 사용하면 타입스크립트가 들어간 값의 타입에 맞게 타입을 추론한다.

const onlyString = ['1', '2', '3', '4'];

const onlyNumber = [1, 2, 3, 4];

const arr1 = [...onlyString]; // string[]로 추론
const arr2 = [...onlyString, ...onlyNumber]; // (string | number)[] 로 추론

중첩된 배열

const strArr: string[][] = [
  ['1', '2', '3'],
  ['23', '33'],
];
const numArr: number[][] = [
  [1, 2, 3],
  [4, 5, 6],
];
const numAndString: (number | string)[][] = [
  ['1', 1],
  ['2', 2, 3],
];
const numOrString: number[][] | string[][] = [
  [1, 2, 3],
  [3, 4, 5, 6],
];
const numOrString2: number[][] | string[][] = [
  ['1', '5'],
  ['2', '4', '7'],
];
for (let num of numArr) {
  for (let x of num) {
  }
}