Неожиданная конкатенация литералов

Question

Я продолжаю получать эту ошибку, когда пытаюсь подключить свою строку с помощью знака +. Хотя, когда я использую запятую, она записывает только последнее слово в строке «арбуз». Он работает, когда я использую знак +, но я хочу избавиться от ошибки. Что здесь происходит?

const fruits = ["apple<br>" + "banana<br>" + "grape<br>" + "pear<br>" + "watermelon"];

let output = '';

//code goes here
function listFruits() {
  for (let i = 0; i < fruits.length; i++) {
    output = fruits[i];
  }
}
/*
let output = `
apple: 2 <br>
banana: 3 <br>
grape: 2 <br>
pear: 2 <br>
watermelon: 4 <br>
`;
*/

listFruits();
document.getElementById("app").innerHTML = output;

Answer 1

Ну, во-первых, это не то, как вы определяете массив. Что происходит, когда вы пишете const fruits = ["apple<br>" + "banana<br>" + "grape<br>" + "pear<br>" + "watermelon"];. Если вы сделаете это, массив будет выглядеть следующим образом: fruits = ["apple<br>banana<br>grape<br>pear<br>watermelon"];

Во-вторых, конкантацию строк можно легко выполнить с помощью метода join (подробнее о котором вы можете узнать здесь https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join#: ~: text = Метод% 20join ()% 20 создает% 20, возвращается% 20без% 20 с использованием% 20сепаратора% 20. )

В вашем случае это будет fruits.join('<br />'), что приведет к document.getElementById("app").innerHTML = fruits.join('<br />')