본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
https://fastcampus.info/4n8ztzq
250729(화) 29일차
문법 - 배열
배열
자바스크립트에서 하나의 변수에는 하나의 값만 들어갈 수 있지만
실무에서는 여러 개의 값을 함께 다루어야 하는 경우가 많아
그럴 때 사용하는 데이터 구조가 객체와 배열
객체 : 각 데이터에 이름(키)이 붙어 있는 구조 - 누가 누구인지가 중요한 경우
배열 : 이름 없이 위치(index)로 데이터를 구분하는 구조 - 순서만 중요하고 이름이 필요 없는 경우
배열 생성과 기본 접근
const books = [];
books[0] = '헨리 6세 1부';
books.push('헨리 6세 2부'); // 맨 뒤에 추가
[ ] 대괄호로 생성하고 빈 배열도 만들 수 있고 생성과 동시에 데이터를 넣을 수 있음
배열은 0부터 인덱스를 시작하며 .length 속성으로 현재 크기를 확인할 수 있음
인덱스의 마지막 값은 항상 length -1
배열 조작 메소드
- push: 맨 뒤에 원소 추가
- pop: 맨 뒤 원소 제거 (리턴도 함)
- shift: 맨 앞 원소 제거
- unshift: 맨 앞에 원소 추가
인덱스를 일일이 신경 쓰지 않아도 되어 배열 조작이 훨씬 안전하고 직관적이다.
slice(start, end)
- 특정 구간의 배열 값을 "복사해서" 새 배열로 리턴
- 원본 배열은 변경되지 않음
- end는 포함하지 않음
splice(start, count, ...items)
- 특정 구간의 값을 "잘라내고" 다른 값으로 대체 가능
- 원본 배열을 직접 수정함
- 제거 대상은 count로 지정, 추가는 뒤에 나열
const arr = ['a', 'b', 'c'];
arr.slice(0, 2); // ['a', 'b']
arr.splice(1, 1, 'x'); // arr = ['a', 'x', 'c']
join
배열을 하나의 문자열로 합쳐줌. 기본 구분자는 ,지만 원하는 문자열도 가능
books.join(' / ');
split
문자열을 특정 구분자로 나눠 배열로 변환.
'book1/book2/book3'.split('/');
concat
기존 배열에 다른 배열을 뒤에 이어 붙여 새로운 배열 생성.
전개 연산자 (...)
가독성 좋고 표현력이 높다. 배열을 직접 펼쳐서 새로운 배열을 만들 수 있다.
const a = [1, 2];
const b = [3, 4];
const c = [...a, ...b];
이번 강의는 배열
배열은 단순한 데이터 묶음이 아닌
순서를 기준으로 데이터를 다루고, 가공하고, 추출하는 매우 유연한 구조