문제 상황
세 개의 문자열을 인자로 받아 전체 이름을 반환하는 JavaScript 함수를 작성해야 합니다. 첫 번째 문자열은 이름(first name), 두 번째 문자열은 성(last name)을 나타내며, 세 번째 문자열은 생략 가능한 중간 이름(middle name)입니다.
함수는 주어진 입력값을 조합해 완성된 전체 이름을 반환해야 하며, 중간 이름이 전달되지 않더라도 불필요한 공백 없이 자연스러운 결과가 나오도록 처리해야 합니다.
접근 방법
이 문제는 배열과 filter() 메서드를 활용하면 깔끔하게 해결할 수 있습니다. 이름, 중간 이름, 성을 순서대로 배열에 담은 뒤, 값이 존재하는 요소만 남기고(filter(Boolean)) 공백으로 연결하면 됩니다.
핵심 아이디어는 다음과 같습니다.
- 중간 이름이 전달되지 않으면 빈 문자열로 초기화합니다.
- 세 값을 하나의 배열에 순서대로 담습니다.
filter(Boolean)으로 빈 문자열 등 거짓(falsy) 값을 제거합니다.join(' ')으로 요소들을 공백 하나로 연결해 최종 이름을 만듭니다.
예제 코드
다음은 실제 구현 코드입니다.
const firstName = 'Vijay';
const lastName = 'Raj';
const constructName = (firstName, lastName, middleName) => {
if(!middleName){
middleName = '';
};
let nameArray = [firstName, middleName, lastName];
nameArray = nameArray.filter(Boolean);
return nameArray.join(' ');
};
console.log(constructName(firstName, lastName));
출력 결과
위 코드를 실행하면 콘솔에 다음과 같이 출력됩니다.
Vijay Raj
코드 설명
filter(Boolean)은 배열의 각 요소를 불리언 값으로 평가하여, 빈 문자열처럼 거짓으로 판정되는 요소를 자동으로 걸러냅니다. 덕분에 중간 이름이 없는 경우에도 'Vijay Raj'처럼 공백이 두 개 들어가는 문제를 피할 수 있습니다.
마지막으로 join(' ')이 남은 요소들을 공백 하나로 연결하기 때문에, 중간 이름이 있는 경우에는 Vijay Middle Raj, 없는 경우에는 Vijay Raj처럼 항상 올바른 형식의 전체 이름이 반환됩니다.