타입스크립트 배열의 이해

잔잔바리한접시·2022년 3월 28일
1

typescript

목록 보기
4/7
post-thumbnail

자바스크립트에서의 배열

자바스크립트에서 배열은 Array 클래스의 인스턴스이며 아래와 같이 선언한다.

const array = new Array
array.push('a');
array.push('b');

console.log(array); // ['a', 'b']

단축 구문

자바스크립트에서는 단축 구문을 사용하여 배열을 만들 수 있다.

let numbers = [1, 2, 3, 4];
let alphabets = ['a', 'b', 'c'];

console.log(numbers); // [1, 2, 3, 4]
console.log(alphabets); // ['a', 'b', 'c']

타입스크립트에서의 배열

타입스크립트에서 배열의 타입은 아이템의 타입 []이다. 예를 들어 배열의 아이템 타입이 number라면 배열의 타입은 number[], 배열의 아이템 타입이 string이라면 해당 배열의 타입은 string[]이다.

const numberArr: number[] = [1, 2, 3];
const stringArr: string[] = ['a', 'b', 'c'];

type IPerson = {
	name: string;
  	age?: number;
}

const personArr: IPerson[] = [{name: 'hoon', age: 26}, {name: 'jae'}];

배열의 비구조화 할당

배열의 비구조화 할당은 객체와는 다르게 []를 사용한다.

let numberArr: number[] = [1, 2, 3, 4];
let [first, second, ...rest] = numberArr;

console.log(first, second, rest) // 1, 2, [3, 4]

배열의 반복문

for...in 문

for...in문은 인덱스 값으로 배열을 순회한다.

let numberArr: number[] = [1, 2, 3, 4];

for(let index in numberArr){
	const value = numberArr[index];
  	console.log(`[${index}]: ${value}`);
}

for...of 문

for...of문은 for...in문과 다르게 item값을 대상으로 배열을 순회한다.

let numberArr: number[] = [1, 2, 3, 4]

0개의 댓글