자바스크립트에서 중첩 배열을 한 줄의 문자열로 병합하는 방법

문제 상황

다음과 같이 숫자로 이루어진 중첩 배열(nested array)이 있다고 가정해 보겠습니다.

const arr = [
    [ 0, 0, 0, -8.5, 28, 8.5 ],
    [ 1, 1, -3, 0, 3, 12 ],
    [ 2, 2, -0.5, 0, 0.5, 5.3 ]
];

여기서 요구되는 것은, 이런 형태의 중첩 배열을 입력받아 배열 안의 모든 숫자를 하나의 문자열로 합쳐주는 자바스크립트 함수입니다.

결과 문자열에서는 인접한 숫자 사이가 공백으로 구분되고, 서로 인접한 두 배열의 요소 사이는 쉼표(,)로 구분되어야 합니다.

구현 코드

이를 구현한 코드는 다음과 같습니다.

const arr = [
    [ 0, 0, 0, -8.5, 28, 8.5 ],
    [ 1, 1, -3, 0, 3, 12 ],
    [ 2, 2, -0.5, 0, 0.5, 5.3 ]
];
const arrayToString = (arr = []) => {
    let res = '';
    for(let i = 0; i < arr.length; i++){
        const el = arr[i];
        const temp = el.join(' ');
        res += temp;
        if(i !== arr.length - 1){
            res += ',';
        }
    };
    return res;
};
console.log(arrayToString(arr));

코드 설명

동작 원리를 단계별로 살펴보면 다음과 같습니다.

• 먼저 결과를 담을 빈 문자열 변수 res를 선언합니다.
• for 반복문으로 바깥 배열을 순회하면서, 각 내부 배열에 join(' ') 메서드를 호출해 요소들을 공백 하나로 연결한 문자열을 만듭니다.
• 만든 문자열을 res에 누적하고, 마지막 배열이 아닌 경우에만 뒤에 쉼표를 붙여 줍니다.
• 모든 순회가 끝나면 완성된 문자열을 반환합니다.

출력 결과

콘솔에 출력되는 결과는 다음과 같습니다.

0 0 0 -8.5 28 8.5,1 1 -3 0 3 12,2 2 -0.5 0 0.5 5.3

더 간단한 한 줄 표현식

반복문 대신 map()과 join()을 조합하면 위 로직을 한 줄로 더 깔끔하게 표현할 수도 있습니다.

const result = arr.map(el => el.join(' ')).join(',');
console.log(result);

각 내부 배열을 먼저 공백 기준으로 문자열로 만든 뒤, 전체를 쉼표 기준으로 다시 합치는 방식으로 동작합니다. 가독성과 유지보수 측면에서 이 방식이 선호되기도 합니다.