Эта статья представляет собой стенограмму моей бесплатной серии YouTube об основах веб-разработки. Если вы предпочитаете смотреть, а не читать, не стесняйтесь посетить мой канал Dev Newbs.

Привет, друзья-новички. Еще один день, еще один метод String. Сегодня это будет метод, который поможет соединить вещи воедино. Представляем метод concat ().

Метод concat () объединяет две или более строк. Результатом метода является полностью новая строка, которая не изменяет существующие строки, используемые в качестве аргументов для метода.

Это означает, что изменения исходной или возвращенной строки не влияют друг на друга.

Давайте посмотрим, как объединить две или более строк в первом примере.

let endOfSentence = "newbs!";
let conStr = "Hello ".concat(endOfSentence);
conStr                                     // Hello newbs!
let str01 = "My ";
let str03 = "is ";
let str04 = "Jacob!";
let resultStr = str01.concat("name ", str03, str04, " 🙂");
resultStr                                  // My name is Jacob! 🙂

Как мы видим в примере, concat не различает строку в переменной и выражение, использующее кавычки. Их можно использовать как взаимозаменяемые. Также смайлики и специальные символы вообще не проблема.

Чтобы объединить более одной строки, вы просто добавляете больше строк в качестве аргументов метода. Вот и все.

Если аргументы не относятся к строковому типу, они будут преобразованы в строковые значения перед объединением.

let prefix = "Concat can deal with: ";
let ctr = prefix.concat(45, " - ", true," - ", ["a", 147.5, false]);
ctr               // Concat can deal with: 45 - true - a,147.5,false

Concat () может обрабатывать любые числовые значения, логические значения и даже массивы.

Однако есть некоторые особые случаи, о которых стоит упомянуть. Как всегда, лучше один раз увидеть, чем сто раз услышать, вот еще один пример.

"".concat({})            // [object Object]
"".concat([])            // ""
"".concat(null)          // null
"".concat(NaN)           // NaN
"".concat(undefined)     // undefined
"".concat(false)         // true
"".concat(1, 1)          // 11

Concat () не может преобразовать объект, поэтому он просто заменяет объект строкой, в которой указывается, что объект был предоставлен. Пустой массив заменяется пустой строкой, такие константы, как null, NaN или undefined, преобразуются в строку без каких-либо проблем, как в случаях в предыдущем примере.

Concat () - не единственный вариант объединения строк. На самом деле есть кое-что еще лучше, о чем вы уже знаете. Вы можете использовать оператор присваивания - да, это то, что они называют знаком плюс.

Посмотрите на сравнение между методом concat () и оператором присваивания в следующем примере.

// concat
{
  let i = 3;
  let s1 = "Number ".concat(i," times 2 equals ");
  let s2 = 2*i;
  let r = s1.concat(s2);
  console.log(r);               // Number 3 times 2 equals 6
}
// assignment operators
{
  let i = 3;
  let s1 = "Number " + i + " times 2 equals ";
  let s2 = 2*i;
  let r = s1 + s2;
  console.log(r);               // Number 3 times 2 equals 6
}

Итак, concat () может делать в основном то же самое. Так что лучше использовать? Что ж, помимо того, что оператор присваивания проще написать, мы настоятельно рекомендуем использовать его вместо метода concat () из-за проблем с производительностью.

В среднем оператор присваивания в два раза быстрее, чем метод concat (). Это связано с накладными расходами, связанными с тем, что concat () является методом объекта String - так эффективно, что это функция.

Если вы мне не верите, взгляните на последний пример, который я приготовил для вас. Как и в предыдущем примере, мы используем как concat (), так и оператор плюс, пытаясь получить одну и ту же строку результата. Но если бы мы просто запустили команды один раз, разница в продолжительности была бы слишком мала для сравнения. Следовательно, мы выполним один и тот же набор операций миллион раз для каждого варианта, и мы получим разницу, вычтя временную метку перед началом из временной метки после завершения миллиона итераций. Впоследствии мы выводим длительность для каждого варианта.

// CONCAT
let startTime = new Date().getTime();
for(let i = 0; i < 1000000; i++){
  let str1 = "Number ".concat(i," times 2 is ");
  let str2 = 2*i;
  let resStr = str1.concat(str2);
}
let endTime = new Date().getTime();
endTime - startTime                        // for example 239
// ASSIGNMENT OPERATOR
let startTime2 = new Date().getTime();
for(let i = 0; i < 1000000; i++){
  let str1 = "Number " + i + " times 2 is ";
  let str2 = 2*i;
  let resStr = str1 + str2;
}
let endTime2 = new Date().getTime();
endTime2 - startTime2                      // for example 95

Таким образом, мы видим, что назначение действительно примерно в два раза быстрее. Это не повлияет на одиночное выполнение, но в реальной жизни вы можете внести некоторые сложные модификации строки в большой набор данных, и тогда это будет иметь большое значение. Так что лучше помнить об этом на будущее.

Как всегда, большое спасибо за ваше время и надеюсь скоро увидеть вас в следующей статье о методе.