El código de abajo lista en pantalla los cuatro valores de la matriz const nums
.
Sin embargo, al usar text +=
lo que esperaría es que la variable text
repitiese su valor antes de añadir el nuevo valor con cada nuevo ciclo dando lugar al siguiente resultado en pantalla:
- Uno
- Uno Dos
- Uno DosTres
- Uno Dos Tres Cuatro
Mi suposición errónea es que al transportar la lógica del operador +=
a la tabla ol
de HTML se añada un nuevo valor de la matriz a los ya existentes por cada ciclo.
Dado esto, me surgen dos dudas.
- Si todos los valores del array son de tipo
string
, ¿por qué no añade el valor que ya tiene al usar el operando? - ¿Qué debería hacer para que cada nuevo elemento
li
de la tabla contenga los valores anteriores antes de añadir el nuevo valor?
const nums = ["Uno", "Dos", "Tres", "Cuatro"];
let fLen = nums.length;
let text = "<ol>";
for (let i = 0; i < fLen; i++) {
text += "<li>" + nums[i] + "</li>";
}
text += "</ol>";
document.getElementById("demo").innerHTML = text;
<!DOCTYPE html>
<html>
<body>
<h2>Arrays</h2>
<p>Los primeros cuatro numerales son:</p>
<p id="demo"></p>
</body>
</html>