JavaScript로 두 문자열을 두 글자씩 번갈아 합치는 방법

문제 소개

이번 글에서는 두 개의 문자열을 입력받아, 첫 번째 문자열에서 두 글자씩, 그다음 두 번째 문자열에서 두 글자씩 번갈아 가며 추출해 하나의 새로운 문자열을 만들어 반환하는 JavaScript 함수를 작성해 보겠습니다.

예를 들어, 다음과 같은 두 문자열이 있다고 가정해 봅시다.

const str1 = 'Hello world';
const str2 = 'How are you btw';

이때 기대되는 출력 결과는 다음과 같습니다.

const output = 'HeHollw o arwoe rlyodu btw';

즉, 'He'(첫 번째 문자열) → 'Ho'(두 번째 문자열) → 'll'(첫 번째 문자열) → 'w '(두 번째 문자열) 순서로 두 글자씩 교차하여 이어 붙인 결과입니다.

구현 코드

그럼 이 함수를 직접 구현해 보겠습니다.

const str1 = 'Hello world';
const str2 = 'How are you btw';

const twiceJoin = (str1 = '', str2 = '') => {
    let res = '', i = 0, j = 0, temp = '';
    for(let ind = 0; i < str1.length; ind++){
        if(ind % 2 === 0){
            temp = (str1[i] || '') + (str1[i+1] || '')
            res += temp;
            i += 2;
        }else{
            temp = (str2[j] || '') + (str2[j+1] || '')
            res += temp;
            j += 2;
        }
    };
    while(j < str2.length){
        res += str2[j++];
    };
    return res;
};

console.log(twiceJoin(str1, str2));

코드 동작 원리

이 코드의 핵심 로직은 다음과 같습니다.

1. 인덱스 판별: 반복 변수 ind가 짝수일 때는 첫 번째 문자열(str1)에서, 홀수일 때는 두 번째 문자열(str2)에서 두 글자씩 가져옵니다.

2. 안전한 문자 접근: (str1[i] || '')와 같은 표현을 사용해 문자열 끝을 넘어선 인덱스에 접근하더라도 undefined 대신 빈 문자열이 더해지도록 처리했습니다. 덕분에 문자열 길이가 2로 나누어떨어지지 않는 경우에도 오류 없이 마지막 한 글자를 처리할 수 있습니다.

3. 남은 문자 처리: 메인 반복문은 첫 번째 문자열이 소진될 때까지 실행되므로, 종료 후에는 두 번째 문자열에 남아 있는 나머지 문자들을 while 문으로 모두 이어 붙입니다.

출력 결과

위 코드를 실행하면 콘솔에 다음과 같은 결과가 출력됩니다.

HeHollw o arwoe rlyodu btw

이처럼 간단한 인덱스 제어만으로 두 문자열을 원하는 규칙에 따라 교차 병합할 수 있습니다. 이 알고리즘의 시간 복잡도는 O(n + m)(n, m은 각 문자열의 길이)로 효율적이며, 필요에 따라 한 번에 가져올 글자 수를 조정해 확장할 수도 있습니다.