행복한 가족, 패밀리그램

개발

JavaScript: 두 배열을 순차적으로 섞는 방법

패밀리그램 2024. 9. 24. 23:04

 

JavaScript에서 두 개의 배열을 순차적으로 섞는 작업은 데이터 처리나 알고리즘 구현 시 자주 발생하는 문제입니다. 이번 포스팅에서는 이 문제를 해결하는 효과적인 방법과 코드 예시를 살펴보겠습니다.

핵심 개념: zip 함수

두 배열을 순차적으로 섞는 핵심 아이디어는 zip 함수를 활용하는 것입니다. zip 함수는 두 배열을 입력으로 받아 각 배열의 같은 인덱스에 있는 요소들을 쌍으로 묶은 새로운 배열을 반환합니다. 이렇게 생성된 쌍들을 다시 풀어서 하나의 배열로 만들면 원하는 결과를 얻을 수 있습니다.

코드 예시

function zip(a, b) {
  const length = Math.min(a.length, b.length);
  const result = [];
  for (let i = 0; i < length; i++) {
    result.push([a[i], b[i]]);
  }
  return result;
}

function shuffleArrays(a, b) {
  const zipped = zip(a, b);
  return zipped.flat(); 
}

const a = ['a', 'b', 'c'];
const b = ['x', 'y', 'z'];
const arr = shuffleArrays(a, b);
console.log(arr); // ['a', 'x', 'b', 'y', 'c', 'z']

설명

  1. zip 함수:
    • 두 배열 a, b를 입력으로 받습니다.
    • 두 배열 중 더 짧은 배열의 길이를 length에 저장합니다.
    • result 배열을 생성하여 결과를 저장합니다.
    • for 루프를 사용하여 length만큼 반복합니다.
    • 각 반복에서 a[i]b[i]를 쌍으로 묶어 result에 추가합니다.
    • result를 반환합니다.
  2. shuffleArrays 함수:
    • 두 배열 a, b를 입력으로 받습니다.
    • zip 함수를 호출하여 두 배열을 쌍으로 묶은 zipped 배열을 얻습니다.
    • zipped.flat()을 사용하여 zipped 배열을 1차원 배열로 평탄화하고 반환합니다.

주의 사항

  • 위 코드는 두 배열의 길이가 다를 경우, 짧은 배열의 길이만큼만 섞습니다.
  • 만약 긴 배열의 나머지 요소들도 결과에 포함시키고 싶다면, zip 함수 또는 shuffleArrays 함수를 적절히 수정해야 합니다.
  • flat() 메서드는 IE에서는 지원되지 않을 수 있습니다. IE에서 사용해야 하는 경우 polyfill을 사용하거나 다른 방법으로 구현해야 합니다.

마무리

이번 포스팅에서는 JavaScript에서 두 배열을 순차적으로 섞는 방법을 zip 함수를 활용하여 설명했습니다. 이 방법은 간결하고 효율적이며, 다양한 상황에서 유용하게 활용될 수 있습니다.

더 나아가기:

  • 배열의 길이가 다를 때 처리 방식을 다르게 설정해보세요.
  • zip 함수를 다른 유용한 기능과 결합하여 활용해보세요.
  • 다양한 배열 조작 문제를 해결하며 JavaScript 실력을 향상시켜보세요!