Typescript 5. 배열과 튜플

하비·2024년 3월 18일
0

typescript

목록 보기
5/14

typescript의 기본타입

let car: string = 'bmw';
// string으로 선언하지 않더라도 미리 유추하고 car는 string 이 됨
let isAdult: boolean = true;
let a:number[] = [1,2,3];
let a2:Array<number> = [1,2,3];
// 두가지 다 배열의 타입을 나타냄
let week1:string[] = ['mon','tue','wed'];
let week2:Array<string>=['mon','tue','wed'];

week1.push(3)//이 경우 3이 string이 아니기 때문에 error 발생

배열

// 배열 타입을 선언하는 기본형
let array: string[];
array = ['one', 'two']

여기서 타입 스크립트는 array의 'one'에 문자 타입이 할 수 있는 메서드를 주는 데에 지장이 없도록 한다.
배열의 타입을 선언함으로써 받을 수 있는 이점은 그 배열의 인덱스의 타입을 정의함으로써 자동으로 쓸 수 있는 메서드를 정의한다는 것.
예시 코드는 이렇다.

array = ['one', 'two']
//여기서 ts는 자동으로 array가 string[] 인 것을 정의함.
for (const number of array){
  console.log(number)// one, two가 찍힘
  console.log(number.toUpperCase())//error 없음
  console.log(number.map())//error: string 타입에 map 함수를 쓸 수 없음
}

튜플

여러 타입의 값을 고정된 길이의 배열로 표현할 수 있게 해주는 기능. 각 인덱스에 고정된 타입을 아이템으로 하는 배열을 선언할 때 사용한다.
튜플을 사용하면 배열에 다양한 타입의 값을 안전하게 저장할 수 있다.
또한 TS컴파일러는 이러한 값들의 타입을 정확하게 추론할 수 있다.
튜플의 경우 제거/추가 시 에러가 뜨지 않으므로 쓸 때 주의가 필요함.(이것을 통제하고 싶다면 readony 을 선언해주면됨)

let b:[string,number]; // 배열의 첫번째는 string, 두번째는 number
b=['z',1]
b=[1,'z']//error

b[0].toLowerCase();
b[1].toLowerCase();//error: number에는 toLowerCase가 없음
//튜플에서 추가 제거 안되게 하려면 readonly를 선언해 줄 수 있다.
type userInfo = readonly [number,string,string]
const tuple:userInfo =[19, '유저', 'norry']
tuple.push('123')//error
//tuple의 다른 형태
[number]//tuple
number[]//타입의 배열 선언
profile
개발자를 꿈꾸는 하비입니다

0개의 댓글