Запоминание таблицы JS, HTML предыдущих значений из формул и добавление новых ниже при нескольких расчётах одной и той же формулы?

Question

Макс @Behemoth911

Запоминание таблицы JS, HTML предыдущих значений из формул и добавление новых ниже при нескольких расчётах одной и той же формулы?

Написал формулы по расчётам, рассчитывает всё сверху-вниз по иерархии, и тут столкнулся с проблемой: у меня выводят данные в таблицу только при значениях первых двух расчётов (что логично). Как мне сделать чтобы таблица запоминала первые два расчёта, а остальные два добавляла в таблицу тоже ниже них? φ выбирал сразу 0.4, потом 0.6, верхние данные записал уже в форму. Проблема в том, что нужно сразу результат 0.4 * фи (при 0.8) а потом то же 0.4 * фи (при 0.9) и так же для 0.6 * фи (при 0.8) и 0.6 * фи (при 0.9).

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Заокругление</title>
</head>
<body>
<h1>Граничная скорость</h1>



<form id="formInput2">
    <div>
        <label>h</label>
        <input type="number" value="0.12">
    </div>
    <div>
        <label>S</label>
        <input type="number" value="10">
    </div>
</form>

<button onclick="breakWay2()">Результат Rцт</button>
<h2 id="resultF3"></h2>

<div id="global-Fi"></div>

<button onclick="breakWay3()">Результат φ` (0.8)</button>
<h2 id="resultF41"></h2>

<button onclick="breakWay4()">Результат φ` (0.9)</button>
<h2 id="resultF51"></h2>

<button onclick="breakWay5()">Результат Vцт (0.8)</button>
<h2 id="resultF61"></h2>

<button onclick="breakWay6()">Результат Vцт (0.9)</button>
<h2 id="resultF71"></h2>



<table border="1">

    <caption>Таблица</caption>
    <tr>
        <th>Номер варианта</th>
        <th>φ`</th>
        <th>Vцт, км/ч</th>

    </tr>
    <tr><td>1</td><td><h2 id="resultF4"></h2></td><td><h2 id="resultF6"></h2></td></tr>
    <tr><td>2</td><td><h2 id="resultF5"></h2></td><td><h2 id="resultF7"></h2></td></tr>
    <tr><td>3</td><td>фи' (0.9*фи с таблицы 0.6) </td><td>результат фи' (0.4) * Rцт </td></tr>
    <tr><td>4</td><td>фи' (0.9*фи с таблицы 0.6)</td><td>результат фи' (0.4) * Rцт</td></tr>
</table>


</body>
</html>

function addGlobalFiTemplate() {
    const FiTemplate = `
<form>
    <label>
        φ:
        <select>
           
           <optgroup label="Асфальтобетон, бетон, φ = 0.4...0.6">
                <option value="0.4">0.4 Мокрый</option>
                <option value="0.6">0.6 Мокрый</option>
            
        </select>
    </label>
</form>`;
    const FiContainer = document.querySelector('#global-Fi');
    if (FiContainer) {
        FiContainer.innerHTML = FiTemplate;
        FiContainer.addEventListener('change', function (event) {
            Fi = Number(event.target.value);
        })
    }
}

let resultRct;
let resultVct;
let resultVct1;
let resultFi1;
addGlobalFiTemplate();

function breakWay2() {
    const form = document.querySelector('#formInput2');
    const h = +form[0].value;
    const S = +form[1].value;
    resultRct = ((S ** 2) + (4 * (h ** 2))) / (8 * h) ;
    console.log(+resultRct.toFixed(2));
    const result = document.querySelector('#resultF3');
    result.innerText = ` ${Number(resultRct.toFixed(2))}`;
    return +resultRct.toFixed(2);
}

function breakWay3() {
    resultFi1 = 0.8 * Fi;
    console.log(+resultFi1.toFixed(2));
    const result = document.querySelector('#resultF4');
    result.innerText = ` ${Number(resultFi1.toFixed(2))}`;
    return +resultFi1.toFixed(2);
}

function breakWay4() {
    resultFi1 = 0.9 * Fi;
    console.log(+resultFi1.toFixed(2));
    const result = document.querySelector('#resultF5');
    result.innerText = ` ${Number(resultFi1.toFixed(2))}`;
    return +resultFi1.toFixed(2);
}

function breakWay5() {
     resultVct = Math.sqrt(127 * resultRct * resultFi1) ;
     console.log(+resultVct.toFixed(1));
     const result = document.querySelector('#resultF6');
     result.innerText = ` ${Number(resultVct.toFixed(1))}`;
     return +resultVct.toFixed(1);
}

function breakWay6() {
    resultVct1 = Math.sqrt(127 * resultRct * resultFi1) ;
    console.log(+resultVct1.toFixed(1));
    const result = document.querySelector('#resultF7');
    result.innerText = ` ${Number(resultVct1.toFixed(1))}`;
    return +resultVct1.toFixed(1);
}