IT프로그램 언어/JavaScript

Java스크립트(배열)

필립곽 2024. 11. 21. 06:40
반응형

이번 포스팅은 JavaScript에서 배열(Array)의 생성과 주요 메서드들에 대해 알아보겠습니다.
배열은 데이터의 집합을 순서대로 저장할 수 있는 강력한 데이터 구조로, 다양한 메서드를 통해 데이터를 쉽게 조작할 수 있습니다.

1. 배열(Array)이란?


배열은 여러 개의 값을 순차적으로 저장할 수 있는 데이터 구조입니다. 각 값은 인덱스를 통해 접근할 수 있으며, 배열의 길이는 동적으로 변할 수 있습니다. JavaScript에서 배열은 객체의 일종이며, 다양한 메서드를 제공합니다.

1.1. 배열 생성
배열은 두 가지 방법으로 생성할 수 있습니다.

1.1.1. 배열 리터럴
가장 일반적인 방법은 배열 리터럴을 사용하는 것입니다. 대괄호 `[]`를 사용하여 배열을 만듭니다.

예제:
const fruits = ["사과", "바나나", "체리"];
console.log(fruits); // ["사과", "바나나", "체리"]

1.1.2. Array 생성자
`Array` 생성자를 사용하여 배열을 생성할 수도 있습니다.

예제:
const numbers = new Array(1, 2, 3, 4, 5);
console.log(numbers); // [1, 2, 3, 4, 5]

2. 배열의 주요 메서드


JavaScript 배열은 데이터를 조작하기 위한 다양한 메서드를 제공합니다. 이 중에서 자주 사용하는 메서드를 살펴보겠습니다.

2.1. `push()`
`push()` 메서드는 배열의 끝에 하나 이상의 요소를 추가하고, 새로운 배열의 길이를 반환합니다.

예제:
const fruits = ["사과", "바나나"];
fruits.push("체리");
console.log(fruits); // ["사과", "바나나", "체리"]

2.2. `pop()`
`pop()` 메서드는 배열의 마지막 요소를 제거하고, 제거된 요소를 반환합니다. 배열의 길이가 하나 줄어듭니다.

예제:
const fruits = ["사과", "바나나", "체리"];
const lastFruit = fruits.pop();
console.log(lastFruit); // "체리"
console.log(fruits); // ["사과", "바나나"]

2.3. `shift()`
`shift()` 메서드는 배열의 첫 번째 요소를 제거하고, 제거된 요소를 반환합니다. 배열의 길이가 하나 줄어듭니다.

예제:
const fruits = ["사과", "바나나", "체리"];
const firstFruit = fruits.shift();
console.log(firstFruit); // "사과"
console.log(fruits); // ["바나나", "체리"]

2.4. `unshift()`
`unshift()` 메서드는 배열의 시작에 하나 이상의 요소를 추가하고, 새로운 배열의 길이를 반환합니다.

예제:
const fruits = ["바나나", "체리"];
fruits.unshift("사과");
console.log(fruits); // ["사과", "바나나", "체리"]

2.5. `map()`
`map()` 메서드는 배열의 각 요소에 대해 주어진 함수를 호출하여 새로운 배열을 생성합니다. 원본 배열은 변경되지 않습니다.

예제:
const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6]

2.6. `filter()`
`filter()` 메서드는 주어진 조건을 만족하는 요소만으로 새로운 배열을 생성합니다. 원본 배열은 변경되지 않습니다.

예제:
const numbers = [1, 2, 3, 4, 5];
const evenNumbers = numbers.filter(num => num % 2 === 0);
console.log(evenNumbers); // [2, 4]
```

2.7. `reduce()`
`reduce()` 메서드는 배열의 각 요소를 순회하면서 누적 값을 계산하여 단일 값을 반환합니다. 초기값을 설정할 수 있습니다.

예제:
const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((accumulator, current) => accumulator + current, 0);
console.log(sum); // 15

3. 배열의 활용 예제


배열은 다양한 상황에서 유용하게 사용됩니다. 예를 들어, 학생의 성적을 저장하고 평균 성적을 계산하는 프로그램을 만들어 볼 수 있습니다.

예제:
const scores = [90, 85, 78, 92, 88];

// 평균 성적 계산
const average = scores.reduce((accumulator, current) => accumulator + current, 0) / scores.length;
console.log("평균 성적:", average); // 평균 성적: 86.6

4. 마치며


오늘은 JavaScript의 배열에 대해 알아보았습니다. 배열의 생성 방법과 주요 메서드인 `push`, `pop`, `shift`, `unshift`, `map`, `filter`, `reduce`를 통해 데이터를 효과적으로 조작하는 방법을 배웠습니다. 이러한 기본 개념을 이해하면 JavaScript 프로그래밍을 더 잘 활용할 수 있습니다.

반응형