Как создать массив полученных данных в javascript?

Я создала страницу с возможностью забронировать билеты на поезд.

Для начала пользователь выбирает направление поезда и дату поездки, дальше отмечает места для брони. Выбранную информацию нужно вывести в таблицу и записать в массив.

Вот как записать в массив не знаю. Догадываюсь, что через push / unshift. Но здесь, насколько понимаю, получится массив объектов вида: {date: 2020-02-20, delivery: Kiev-Lviv, place: 20, place: 21}.

let direction = document.querySelector(".direction");
let date = document.querySelector(".date");
let btn = document.querySelector("button");
let out = document.querySelector(".out");
let hr = document.createElement("hr");
let div = document.createElement("div");
div.className = "places";
let btnBook = document.createElement("button");
btnBook.className = "btn_book";
btnBook.innerHTML = "Book";
let sum = 0;
let totalSum = document.createElement("div");
totalSum.innerHTML = "Total price: <b>" + sum + "</b>";
let table = document.createElement("table");
let tableHead = document.createElement("tr");
tableHead.innerHTML = "<th>Direction</th><th>Date</th><th>Seat</th>"
let p = document.createElement("p");
p.innerHTML = "<b>My tickets:</b>";

btn.addEventListener("click", function() {
  out.append(hr);
  out.append(div);
  for (i = 1; i <= 28; i++) {
    let checkbox = document.createElement("checkbox");
    checkbox.className = "create_checkbox";
    checkbox.innerHTML = '<input type="checkbox" value="' + i + '" class="checkbox"><label for="checkbox">' + i + '</label>';
    div.append(checkbox);
  };
  div.append(totalSum);
  div.append(btnBook);

  let allCheckbox = document.querySelectorAll("input[type='checkbox']");


  btnBook.addEventListener("click", function() {
    out.append(p);
    out.append(table);
    table.append(tableHead);
    for (let elem of allCheckbox) {
      if (elem.checked == true) {
        for (let k = 0; k < elem.checked; k++)
          sum = sum + 64;
        let tableBody = document.createElement("tr");
        tableBody.innerHTML = "<tr><td>" + direction.value + "</td><td>" + date.value + "</td><td>" + elem.value + "</td></tr>";
        table.append(tableBody)
      };
      totalSum.innerHTML = "Total price: <b>" + sum + "</b>";
    };

  });
});
<label for="direction">Direction:</label>
<select class="direction">
  <option>Odessa - Lviv</option>
  <option>Odessa - Kiev</option>
  <option>Odessa - Moscow</option>
  <option>Odessa - Nikolaev</option>
</select>
<label for="date">Date</label>
<input type="date" class="date">
<button type="button">Search</button>
<div class="out"></div>


Ответы (0 шт):