다시 공부하는 자바스크립트- Array 자바스크립트 배열 완벽 가이드: 배열 만들기, 접근, 수정까지 한눈에 정리

자바스크립트 배열이란?

프로그래밍을 하다 보면 관련된 데이터를 한 번에 묶어 처리하고 싶은 경우가 자주 생긴다. 예를 들어, 일주일의 요일이나 쇼핑 목록처럼 연관된 데이터를 다룰 때 자바스크립트 배열(Array)을 사용하면 효율적이다.

 

배열 없이 데이터를 나열한다면?

만약 배열 없이 요일을 저장한다고 가정해보겠다.

 

const mon = 'mon';

const tue = 'tue';

const wed = 'wed';

const thu = 'thu';

const fri = 'fri';

const sat = 'sat';

const sun = 'sun';

 

이렇게 일일이 변수를 만들면 코드가 비효율적이고 관리도 어렵다.

 

 

배열로 요일을 저장하기

자바스크립트 배열은 대괄호 []와 쉼표 ,를 사용해 데이터를 그룹화할 수 있다.

 

const daysOfWeek = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'];

이렇게 배열을 사용하면, 단 하나의 변수로 모든 요일을 관리할 수 있어 효율적.

 

 

배열에서 특정 항목 가져오기 (Indexing)

배열에서 원하는 항목을 가져오려면 배열이름[인덱스] 형태로 접근하면 됩니다. 예를 들어, 금요일을 가져오고 싶다면 다음과 같이 작성한다.

 

console.log(daysOfWeek[4]); // 출력: fri

📌 주의: 자바스크립트에서 배열의 인덱스는 0부터 시작합니다. 즉, daysOfWeek[0]은 'mon'입니다.

 

 

 

배열에 새로운 요소 추가하기 (push 메서드)

push() 메서드를 사용하면 배열의 마지막에 새로운 요소를 쉽게 추가할 수 있습니다.

 

daysOfWeek.push('holiday'); console.log(daysOfWeek); // 출력: ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun', 'holiday']

 

 

 

배열의 장점과 활용 예시

배열은 하나의 변수에 여러 개의 값을 저장할 수 있기 때문에, 다음과 같은 상황에서 유용하게 쓰입니다.

 

📌 쇼핑 목록 만들기

 

const toBuy = ['potato', 'tomato', 'pizza'];

 

toBuy.push('apple');

console.log(toBuy); // 출력: ['potato', 'tomato', 'pizza', 'apple']

 

 

마무리

이번 글에서는 자바스크립트의 가장 기본적인 자료구조인 배열(Array)에 대해 알아보았다. 배열을 통해 데이터를 정리하는 방법, 특정 항목을 가져오는 법, 요소를 추가하는 법까지 다양한 내용을 다뤘다.

배열은 초보자에게 꼭 필요한 개념이며, 자바스크립트를 제대로 이해하기 위한 첫걸음이다