Colin's Blog
[javascript] 문자열 합치기

개요

Javascript에서 문자열을 합치는 방법은 여러 가지가 있습니다. 이 글에서는 다양한 방법을 소개하고, 각 방법의 장단점을 알아보겠습니다.

연산자를 이용한 합치기

가장 간단한 문자열 합치기 방법은 연산자(+)를 사용하는 것입니다.

let str1 = "Hello";
let str2 = "World";
let result = str1 + " " + str2;
console.log(result); // 출력: Hello World

연산자를 이용해 여러 문자열을 연결할 수 있으며, 필요한 경우 공백이나 다른 문자열을 포함할 수 있습니다. 하지만 연산자를 연속적으로 사용하면 코드가 복잡해질 수 있고, 처리 속도가 느려질 수 있습니다.

Array의 join() 메서드 사용하기

Javascript의 Array 객체에는 join() 메서드가 있습니다. 이를 이용해 배열의 요소를 문자열로 합칠 수 있습니다.

let arr = ["Hello", "World"];
let result = arr.join(" ");
console.log(result); // 출력: Hello World

join() 메서드는 인수로 구분자를 받아 각 요소를 구분자로 연결한 문자열을 반환합니다. 구분자를 생략하면 기본값인 쉼표(,)로 요소들이 구분됩니다.

Template literals (템플릿 문자열) 사용하기

ECMAScript 6부터 도입된 템플릿 리터럴은 문자열을 좀 더 간결하고 가독성 있는 방식으로 합칠 수 있게 해줍니다.

let str1 = "Hello";
let str2 = "World";
let result = `${str1} ${str2}`;
console.log(result); // 출력: Hello World

템플릿 리터럴 안에는 ${}로 변수나 표현식을 넣을 수 있습니다. 이를 통해 코드를 더 직관적으로 작성할 수 있습니다.

성능 비교

Javascript에서 문자열을 합치는 성능은 여러 메서드로 이용하는 방식에 따라 다릅니다. 성능을 비교하기 위해 간단한 테스트를 수행해보겠습니다.

let count = 1000000;
console.time("Operator");
let str1 = "";
for (let i = 0; i < count; i++) {
  str1 += "Hello";
}
console.timeEnd("Operator");

console.time("Join");
let arr = [];
for (let i = 0; i < count; i++) {
  arr.push("Hello");
}
let str2 = arr.join("");
console.timeEnd("Join");

console.time("Template Literal");
let str3 = "";
for (let i = 0; i < count; i++) {
  str3 += `Hello`;
}
console.timeEnd("Template Literal");

위 코드는 100만번의 문자열 합치기를 세 가지 방법으로 수행하는 간단한 성능 테스트입니다. 이를 실행하면 각 방법의 수행 시간을 콘솔에 출력합니다.

실행 결과를 보면, 일반적으로 join() 메서드를 사용한 방법이 가장 빠르게 수행되는 것을 알 수 있습니다. 하지만 일반적인 상황에서는 성능 차이가 크게 나타나지 않으므로, 가독성과 코드 유지보수성을 고려해 적절한 방법을 선택하는 것이 중요합니다.

결론

Javascript에서 문자열을 합치는 방법은 다양하게 있습니다. 연산자를 사용하는 방법은 간단하지만 코드가 복잡해질 수 있습니다. join() 메서드는 간결하게 사용할 수 있으며, 성능도 좋습니다. 템플릿 리터럴은 가장 직관적이고 가독성이 높은 방법입니다. 적절한 상황에 맞게 적절한 방법을 선택해 사용하면 됩니다.

참고 자료

© 2018 Colin. All rights reserved.