[JavaScript] 배열

배열이란?

JavaScript의 배열은 값들의 순서 있는 리스트(컬렉션)이며, 다양한 타입의 데이터를 저장할 수 있는 객체입니다.
다른 언어의 배열과 달리 JS 배열은 동적 크기(dynamic size)를 가지며, 객체(Object)로 구현되어 있습니다.

let arr = [1, 2, 3, 4];
console.log(typeof arr); // "object"

---

배열 생성 방법

// 배열 리터럴
let fruits = ["사과", "바나나", "포도"];

// 생성자 함수
let numbers = new Array(1, 2, 3);

// 빈 배열 생성
let empty = [];

---

배열 주요 메서드

// 반복
// for, forEach, for... of
fruits.forEach((fruit, idx) => {
  console.log(`${idx}번: ${fruit}`);
});

// 탐색
// indexOf(), includes(), find(), findIndex()
fruits.includes("사과"); // true
fruits.indexOf("바나나"); // 1

// 추가 및 제거
// push(), pop(), unshift(), shift()
fruits.push("오렌지"); // ["사과", "바나나", "포도", "오렌지"]
fruits.pop();          // ["사과", "바나나", "포도"]

// 정렬 - 슬라이싱 - 병합
// sort(), reverse()
// slice(), splice()
// concat(), join()
let nums = [3, 1, 4];
nums.sort(); // 기본은 문자열 기준 정렬 → [1, 3, 4]
nums.slice(0, 2); // [1, 3]

---

주의할 점

• Array는 객체이므로 typeof로 구분이 어렵다 → Array.isArray(arr) 사용
• sort()는 기본적으로 문자열 정렬 → 숫자 정렬은 콜백 함수 필수

nums.sort((a, b) => a - b); // 오름차순 숫자 정렬

• 배열 복사 시 얕은 복사 주의 (원본이 함께 변경될 수 있음)

---

배열 복사 (얕은 복사 vs 깊은 복사)

let arr1 = [1, 2, 3];
let arr2 = arr1; // 얕은 복사 (참조 공유)
arr2[0] = 100;
console.log(arr1); // [100, 2, 3] -> 원본 배열 요소 변경

let arr3 = [...arr1]; // 전개 연산자를 통한 복사 (얕은 복사)
let arr4 = JSON.parse(JSON.stringify(arr1)); // 깊은 복사

자주 사용하는 배열 메서드

// 배열 필터링
let nums = [1, 2, 3, 4, 5];
let even = nums.filter((n) => n % 2 === 0);

// 배열 매핑
let squares = nums.map((n) => n * n);

---

정리요약

특징	설명
인덱스 기반 접근	배열 요소는 0부터 시작하는 인덱스를 통해 접근 가능
다양한 타입 허용	하나의 배열에 숫자, 문자열, 객체 등 다양한 타입의 값 저장 가능
동적 크기 조절 가능	배열은 생성 후에도 요소를 추가하거나 제거하여 크기 변경 가능
length 속성	배열의 길이(가장 큰 인덱스 + 1)를 나타내며, 직접 수정도 가능
순서 보장	배열에 삽입한 요소는 삽입한 순서대로 유지됨
배열은 객체이다	typeof 배열 → "object"로 반환됨 (Array.isArray()로 배열 여부 확인 필요)
희소 배열 가능	중간 인덱스를 건너뛴 배열도 생성 가능 ([1, , 3])
내장 메서드 제공	push, pop, map, filter, reduce 등 다양한 고차 함수 및 조작 메서드 제공