Wytłumaczenie co robia poszczególne wiersze w kodzie

Question

Witam mam problem ze zrozumieniem co robią poszczególne wiersz i prosił bym o wyjasnienie w skrócie co robią.Te wiersze których nie rozumiem są ponumerowane  od 1. do 5. 

    <input id="tabela" type="number">
    <button id="przycisk">UTWÓRZ</button>
    <table id="tablica"></table>
    <script>

 
        var _input = document.getElementById('tabela');
        var _button = document.getElementById('przycisk');
        var _table = document.getElementById('tablica');

function makeTable (array) {
         1.  for ( let i = 1; i < parseInt(array) +1; i++ ) {
             2.   var _tr = document.createElement('tr');
             3.   _tr.innerHTML = `<td> ${i} </td> <td> ${Math.floor(Math.random() * 101)} </td>`;
             4.   _table.appendChild(_tr);
            }
        }
 
     5.   _button.addEventListener('click',()=> {
            makeTable(_input.value);

 }
         )
  </script>

Answer 1

1) do funkcji przekazywany jest parametr array, pętla for ma się wykonywać do momentu gdy iterator "i" (zmienna i) będzie mniejszy od array. parseInt to rzutowanie na liczbę całkowitą tzn. gdybyś przekazał do funkcji np "10" jako napis to zamieni go na 10 (liczbę)

2) tworzony jest element HTML ('tr') - wiersz tabeli

3) wykorzystując ES6 tworzony jest napis (fragment kodu html) zawierający 2 kolumny w pierwszej jest zmienna "i"czyli wartość aktualnej iteracji pętli od 1 czyli póżniej 2,3,4,....itd w drugiej kolumnie losowana jest liczba z przedziału 0-100.

4) utworzony w punkcie 2 wiersz jest dołączany do tabeli

5) do przycisku '_button dodawany jest event click - po kliknięciu odpalona zostanie funkcja tworząca tabele z parametrem - wartością w inpucie tabela

Ten kod po naciśnięciu przycisku 'Utwórz' dołączy do tabeli ilość wierszy wpisaną w pole input w każdym wierszu będą się znajdowały 2 kolumny kolejna liczba od 1 (w pierwszej) i losowa wartość (0-100) w drugiej

Comments

Dziękuję bardzo za wyjaśnienie