240619 배열과 내장함수

이 글은 네이버 블로그에 2024년 6월 19일에 올렸던 것을 그대로 옮겨온 것입니다.

배열은 데이터 구조에서 매우 중요한 역할을 하며, 내장함수는 이를 더욱 효과적으로 다루는 데 큰 도움을 줍니다. 이 포스트에서는 배열의 기본 개념과 자바스크립트 내장함수들을 설명하겠습니다.

배열 (Array)

배열은 여러 개의 값을 하나의 변수에 저장할 수 있는 데이터 구조입니다. 배열의 각 값은 인덱스로 접근할 수 있습니다. 자바스크립트에서 배열은 다음과 같이 선언할 수 있습니다.

// 배열 선언
let fruits = ['Apple', 'Banana', 'Cherry'];

배열의 요소는 0부터 시작하는 인덱스를 통해 접근할 수 있습니다.

console.log(fruits[0]); // 'Apple'
console.log(fruits[1]); // 'Banana'

배열 내장함수

자바스크립트는 배열을 다룰 때 유용한 다양한 내장함수를 제공합니다. 몇 가지 주요 내장함수를 살펴보겠습니다.

1. push()

배열의 끝에 하나 이상의 요소를 추가합니다.

fruits.push('Orange');
console.log(fruits); // ['Apple', 'Banana', 'Cherry', 'Orange']

2. pop()

배열의 마지막 요소를 제거하고, 그 요소를 반환합니다.

let lastFruit = fruits.pop();
console.log(lastFruit); // 'Orange'
console.log(fruits); // ['Apple', 'Banana', 'Cherry']

3. shift()

배열의 첫 번째 요소를 제거하고, 그 요소를 반환합니다.

let firstFruit = fruits.shift();
console.log(firstFruit); // 'Apple'
console.log(fruits); // ['Banana', 'Cherry']

4. unshift()

배열의 앞에 하나 이상의 요소를 추가합니다.

fruits.unshift('Strawberry');
console.log(fruits); // ['Strawberry', 'Banana', 'Cherry']

5. forEach()

배열의 각 요소에 대해 함수를 실행합니다.

fruits.forEach(function(fruit) {
  console.log(fruit);
});
// 출력:
// 'Strawberry'
// 'Banana'
// 'Cherry'

6. map()

배열의 각 요소를 변환하여 새로운 배열을 만듭니다.

let upperFruits = fruits.map(function(fruit) {
  return fruit.toUpperCase();
});
console.log(upperFruits); // ['STRAWBERRY', 'BANANA', 'CHERRY']

7. filter()

조건을 만족하는 배열의 요소들로 새로운 배열을 만듭니다.

let filteredFruits = fruits.filter(function(fruit) {
  return fruit.includes('a');
});
console.log(filteredFruits); // ['Banana']

8. reduce()

배열의 각 요소를 하나의 값으로 줄입니다.

let numbers = [1, 2, 3, 4];
let sum = numbers.reduce(function(total, num) {
  return total + num;
}, 0);
console.log(sum); // 10