Конкатенация строк в JS (JavaScript)

В этой статье мы рассмотрим, как осуществляется конкатенация строк в JS (JavaScript) различными способами с примерами. Это руководство нацелено на охват основ того, что необходимо знать о работе со строками в JavaScript.

Под термином «конкатенация» понимается процесс объединения вещей друг с другом. Стоит отметить, что в JavaScript он в основном применяется для обозначения процесса соединения значений переменных или нескольких строк с целью получения более длинных строк.

Метод concat()

Как следует из названия, этот метод объединяет несколько строк. Он не изменяет их. Вместо этого он возвращает новую строку, в которой объединены все исходные.

string.concat(string1, string2, ..., stringN);

В этом коде параметры string1, string2, …, stringN — это строки, которые необходимо объединить.

const str1 = 'Example of ';
const str2 = 'Javascript ';
const str3 = 'String Concatenation';
const res = str1.concat(str2, str3);
console.log(res);

Во-первых, одним из недостатков использования concat() является то, что передаваемый параметр обязательно должен быть строкой. Если передать в него не строковые параметры, он выдаст ошибку TypeError, если переданная строка == null. Во-вторых, строки в JavaScript неизменяемы, поэтому concat() не изменяет итоговую строку.

Конкатенация строк в JS с помощью оператора +

Оператор + используется для сложения чисел. Но конкатенация строк в JS с его помощью также возможна. Можно также объединять строки с помощью оператора +, используя сокращённый синтаксис +=.

let str = 'Hello';
str += ' ';
str += 'World';

Метод array.join()

Метод array.join() используется для объединения всех элементов массива в строку. Элементы будут разделены указанным разделителем. В связи с тем что он является необязательным параметром по умолчанию используется (,).

array.join(separator)

Метод array.join() не изменяет исходный массив.

let array = ['JavaScript', 'String', 'Concatenate'];
let final String = array.join();
console.log(final String); 

Читайте также: Как сделать HTTP запрос в JavaScript.

Конкатенация строк в JS через шаблонный литерал

Это строковые литералы, допускающие встроенные выражения.

let expression = 'String1'
`string text ${expression} string text

Более того, их можно применять функции интерполяции строк.

let str1 = 'Javascript';
let str2 = 'String';
let str3 = 'Concatenate';

let str Joined = `${str1} ${str2} ${str3}`;

console.log(str Joined);

Кроссбраузерность

Что касается поддержки браузерами, методы concat() и join() поддерживаются всеми современными версиями. Какой из них лучше всего использовать? Стоит отметить, что эти методы работают по-разному в различных браузерах. В частности, в Chrome concat() выполняется быстрее, чем array.join() в Firefox, и наоборот. Более подробные показатели их производительности будут рассмотрены в другой статье.