Łączenie ciągów znaków w JS

Operator '+’

Najczęściej używany przez początkujących programistów jest operator '+’. Pozwala on tworzyć nowe ciągi znaków lub dopisywać do istniejących jeśli użyjesz +=.

const favouriteFramework = 'Angular';
const string = "Mój ulubiony framework to " + favouriteFramework;
console.log(string);
// Mój ulubiony framework to Angular

const string = "Mój ulubiony framework to ";
const string += 'Angular';
console.log(string);
// Mój ulubiony framework to Angular

Join

Metoda join pozwala utworzyć ciąg znaków z tablicy elementów. Join jako parametr przyjmuje separator, który domyślnie ma wartość przecinka.

Metoda nie ostrzeże Cię jeśli w tablicy będą inne typy danych – trzeba uważać na umieszczenie w tablicy funkcji lub obiektów. W przypadku gdy spróbujesz wykonać join na tablicy zawierającej obiekt ['word', {}] otrzymasz ciąg znaków "a,[object Object]".

const array = ['Angular', 'jest', 'super'];
const string = array.join(' ');
console.log(string);
/// Angular jest super

Concat

const word = 'super';
const string = 'Angular jest '.concat(word);
console.log(string);
/// Angular jest super

Template Strings (interpolacja ciągów znaków)

const word = 'super';
const string = `Angular jest ${word}`;
console.log(string);
/// Angular jest super

Porównanie wydajności

Jeśli chcesz dowiedzieć się jak zmierzyć czas wykonywania kodu, zajrzyj tutaj.

Wyniki poszczególnych metod łączenia ciągów znakowych dla miliona przypisań (link):

	Operator '+’	Join	Concat	Template strings
Próba I	7.8s	259.7s	35.2s	14.9s
Próba II	9.2s	396s	37.4s	17s
Próba III	9s	269s	42.4s	17.1s

Jak pewnie sam zauważyłeś najszybszą metodą łączenia ciągów znakowych w moim przypadku jest operator '+’. Jednak nie jest to reguła! Zależy to między innymi od przeglądarki (a nawet jej wersji). Najczęsciej używanym przeze mnie sposobem jest template string, chociaż zdarza mi się korzystać z concat/join w przypadku łączenia 10+ ciągów znakowych.

Masz inny sposób na łączenie stringów? Jaki według Ciebie jest najlepsze rozwiązanie?