Приступая к работе с JavaScript, получил вопросы

Я следую учебному пособию для начинающих по w3school для JS. Есть кое-что, чего я не понимаю из кода ниже:

<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var cars = ["Saab","Volvo","BMW"];
var text = "";
for(var i = 0; i < cars.length; i++) {
text+=cars[i] + "<br>";
}


document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Может кто-нибудь объяснить мне логику text+=cars[i]? Я это понимаю += означает приращение, но я не могу понять логику добавления элемента массива в переменный текст.

Большое спасибо за ваши быстрые ответы! У меня есть дополнительный вопрос: есть ли альтернатива для отображения информации того же типа с использованием

var text = "";

а также

text+=cars[i]

кусочки кода? Если так, то как будет выглядеть фрагмент кода и что я должен вставить в HTML, если нет

text

?

Еще раз спасибо!

8 ответов

Решение

a+=b коротка для a=a+b, В вашем случае у вас есть text = text + cars[i] + "<br>",

text это строка, и вы используете + добавить значение из массива (который содержит строки), а затем добавить "<br>"

+= не является приращением. Это добавление (в данном случае конкатенации) и сохранение результата в той же переменной.

var a +=b;

Это то же самое для:

var = a + b;

В вашем случае скрипт объединяет все элементы массива в одну строку и добавляет <br> теги между ними.

Считай это так,

text+=cars[i] + "<br>"; 

на самом деле

text=text+cars[i]+"<br>";

так что вместо удаления старого значения оно объединит новое слово с существующей строкой (String Concatenation).

PS: Как начинающий товарищ, небольшой совет, вместо того, чтобы следовать школам W3, пожалуйста, заходите на сайт, как codecademy, который поможет вам учиться вместе с практикой и правильными объяснениями.

text += cars[i] + '<br>';

Объединяет элемент i массива cars с текстом, разделенный <br> тег.

В JavaScript + используется для объединения строк

Код

for(var i = 0; i < cars.length; i++) {
   text+=cars[i] + "<br>";
}

выбирает каждый элемент из массива и объединяет
"к этому.

Если вы консольно записываете текст перед установкой innerHTML, он выглядит примерно так:

"Saab<br>Volvo<br>BMW<br>"

Здесь они делают это на самом деле просто для того, чтобы показать, что нет смысла делать это таким образом, они просто хотят показать, чтобы достичь каждого индивида внутри массива и объединить его в строку, то же самое, что вы можете сделать с помощью метода Array.prototype.join(). подумайте здесь, что вы должны использовать, поскольку они всегда показывают конкатанаты в строку, если вы хотите, вы можете просто использовать каждого отдельного человека внутри, как вы хотите, а также

Значение text в конце цикла будет

Saab<br>Volvo<br>BMW<br>

где br обозначает разрыв строки. Так что каждый из них будет напечатан на новой строке. И последняя строка кода

document.getElementById("demo").innerHTML = text;

изменяет значение HTML-элемента, который имеет идентификатор demo к тому из text,

Не думай о += как увеличение, это ++,

a = a + b
a += b;

Эти два утверждения одинаковы. Нижний принимает переменную на левой стороне (a) и добавляет к нему правую сторону (b), а затем назначает все обратно на левую сторону (a). Так что это просто стенография.

Так что вы делаете в своем коде добавление строки из cars[i] на ваш переменный текст.

Это сделало бы то же самое:

text = text + cars[i] + "<br>";

Как только цикл запустится, у вас будет следующее в text:

Saab<br>Volvo<br>BMW
Другие вопросы по тегам