join ("") вызывается для строкового массива только с одним элементом. Цель?

Question

Я видел этот код в видео-учебнике:

const navToggle = ["<div id='toggle-menu'>Menu</div>"].join("");
$(".site-header").prepend(navToggle);

Я понимаю, что он в основном делает. Но чего я не получаю, так это вызова соединения.

Какова цель соединения здесь?

Не было бы ...

const navToggle = "<div id='toggle-menu'>Menu</div>";
$(".site-header").prepend(navToggle);

... тоже самое?

Answer 1

Какова цель присоединения здесь?

В этом примере? Никто. Как вы сказали, вам лучше использовать:

const navToggle = "<div id='toggle-menu'>Menu</div";

В случае general , если мы предположим, что код может добавить больше элементов в массив, а затем выполнить join позже , это один из способов создания большой строки HTML:

const navToggle = ["<div id='toggle-menu'>Menu</div"];
if (someCondition) {
    navToggle.push("<div>something</div>");
}
if (someOtherCondition) {
    navToggle.push("<div>another thing</div>");
}
const str = navToggle.join("");

В результате str - это фрагменты HTML из элементов, объединенные между собой ничем. (join по умолчанию ставит запятую между ними, но передача "" отменяет это). (Раньше это было быстрее, чем при использовании конкатенации строк в некоторых движках JavaScript. Больше нет во многих, и в любом случае создание этой строки вряд ли станет узким местом в производительности.)

Но в коде, который вы показали? В этом нет никакого смысла, нет.