자바스크립트에서 배열은 데이터를 저장하고 처리하는 데 매우 유용한 자료 구조입니다. 때로는 배열의 특정 요소를 다른 값으로 대체해야 할 때가 있습니다. 예를 들면, 특정 조건을 만족하는 요소를 다른 값으로 변경하거나, 배열의 특정 위치에 해당하는 요소를 새로운 값으로 바꾸는 경우입니다.

이번 블로그 포스트에서는 자바스크립트에서 배열의 요소를 특정 기준으로 대체하는 방법에 대해 알아보겠습니다.

1. map() 함수를 사용한 요소 대체하기

map() 함수는 배열의 각 요소에 대해 지정된 함수를 호출하고, 그 함수의 반환 값을 새로운 배열에 담아 반환하는 기능을 제공합니다. 따라서 map() 함수를 사용하면 배열의 요소를 특정 기준으로 대체할 수 있습니다.

다음은 map() 함수를 사용하여 배열의 요소를 대체하는 간단한 예제 코드입니다.

const arr = [1, 2, 3, 4, 5];

const newArr = arr.map(item => {
  if (item % 2 === 0) {
    return item * 2; // 짝수인 경우에는 요소를 두 배로 대체
  } else {
    return item; // 홀수인 경우에는 요소를 그대로 유지
  }
});

console.log(newArr); // [1, 4, 3, 8, 5]

위의 예제에서는 map() 함수를 사용하여 배열의 요소를 대체하고 있습니다. 작성된 함수 내부에서는 요소의 값을 확인하여 홀수와 짝수에 따라 대체를 수행하고 있습니다.

2. forEach() 함수를 사용한 요소 대체하기

forEach() 함수는 배열의 각 요소에 대해 지정된 함수를 호출하는 기능을 제공합니다. 이 함수는 반환 값을 갖지 않으며, 배열의 요소를 수정하기 위해서는 원본 배열을 직접 변경해야 합니다.

다음은 forEach() 함수를 사용하여 배열의 요소를 대체하는 예제 코드입니다.

const arr = [1, 2, 3, 4, 5];

arr.forEach((item, index) => {
  if (item % 2 === 0) {
    arr[index] = item * 2; // 짝수인 경우에는 요소를 두 배로 대체
  }
});

console.log(arr); // [1, 4, 3, 8, 5]

위의 예제에서는 forEach() 함수를 사용하여 배열의 요소를 대체하고 있습니다. 반복문 내에서 if 문을 사용하여 요소 값이 짝수인 경우에만 대체를 수행하고 있습니다. forEach() 함수 내부에서는 원본 배열을 직접 수정하여 요소를 대체합니다.

3. filter() 함수와 map() 함수를 결합하여 특정 조건에 맞는 요소 대체하기

filter() 함수는 배열의 요소 중 특정 조건을 만족하는 요소만 걸러내는 기능을 제공합니다. 이와 함께 map() 함수를 사용하여 걸러진 요소들을 특정 기준으로 대체할 수 있습니다.

다음은 filter() 함수와 map() 함수를 결합하여 배열의 요소를 대체하는 예제 코드입니다.

const arr = [1, 2, 3, 4, 5];

const newArr = arr.filter(item => item % 2 === 0) // 짝수 요소들만 필터링
                  .map(item => item * 2); // 필터링된 요소들을 두 배로 대체

console.log(newArr); // [4, 8]

위의 예제에서는 먼저 filter() 함수를 사용하여 배열의 짝수 요소들을 필터링합니다. 그리고 이후 map() 함수를 사용하여 필터링된 요소들을 두 배로 대체합니다. 그 결과, [4, 8]이라는 새로운 배열이 생성되어 출력됩니다.

마무리

이번 블로그 포스트에서는 자바스크립트에서 배열의 요소를 특정 기준으로 대체하는 방법을 알아보았습니다. map() 함수와 forEach() 함수를 사용하여 요소를 대체할 수 있으며, filter() 함수와 map() 함수를 결합하여 조건에 맞는 요소를 대체할 수도 있습니다. 각각의 방법은 상황에 따라 선택하여 사용할 수 있습니다. 적절한 방법을 선택하여 배열의 요소를 효율적으로 대체해보세요.