How to understand why when the function is not executed a certain fragment?

Good afternoon. There is a code snippet, which displays an existing array on the page and adds and removes when you call .push and .pop. Function at the beginning of your code takes the current array, bringing to the page after clicking the button .push, we adds a new element to the array, and to display we're in the function p1 (method .push) the function call test() again. And the question is, why in the for loop to the page not displayed again, the contents of the array and only output a NEW value. The same thing happens with .pop just removes the last element of an array, without printing the entire array. How does it work?

let m = [1, 2, 3, 4, 5, 6, 'hello'];

function test (){
 let p = document.getElementById('out');
 let str = ";
 for (let i = 0; i < m.length; i++) {
 str += i + '--- ' + m[i] + '<br>';
}
 p.innerHTML = str;
}


test();


function p1(){
 let i1 = document.getElementById('i1').value;
m.push(i1);
 test(); 
}

function p2(){
m.pop();
test();
}
April 3rd 20 at 18:53
1 answer
April 3rd 20 at 18:55
Yes seems to be OK with your code. Link. If you comment out the call to p2 in line 29 displays the array item is added to p1.
Well, the fact that it works as it should is clear. I just don't understand why when the function test function p1, the for loop iterates through and displays the new values, but not all. And if you just test call, it all the current shows that are set initially in the array - manuel.Murphy commented on April 3rd 20 at 18:58
@manuel.Murphy, In your test code when called from p1 goes through the whole array and not just new elements. Can check the link that I took off. - merlin_Miller commented on April 3rd 20 at 19:01

Find more questions by tags JavaScript