I want to know what these line of code means , much appreciable if I get to know in detail-CodePudding

let text = "Hello";

const myArr = text.split("");

text = "";

for (let i = 0; i < myArr.length; i  ) {
  text  = myArr[i]   "<br>"
}

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

<span id="demo" />

CodePudding user response：

Don't hesistate to use console.log some googling to understand what the script does:

// Assign Hello string to text variable
let text = "Hello";
console.log(text);

// Split text ("Hello") with token "", that's to say split into an array of character (['H','e','l','l','o'])
const myArr = text.split("");
console.log(myArr);

// Set text to an empty string
text = "";
console.log(text)

// Loop on myArr (['H','e','l','l','o']) and concat its element separated by "<br>"
for (let i = 0; i < myArr.length; i  ) {
  text  = myArr[i]   "<br>"
  console.log(`what text looks like after iteration ${i}: ${text}`)
}
console.log(text)

// Set the inner html of element in the dom with id "demo" to text
// It should display H, e, l, l, o with line breaks
document.getElementById("demo").innerHTML = text;

CodePudding user response：

You should look into browser devtools - the js debugger in particular. If you set a breakpoint at the first line, you can then step through it line by line and see exactly what is happening.