const forTable = (arr) => {
  let str = "<table style = 'border-collapse: collapse; border: 1px solid; text-align: center; margin-top: 20px;'>";
  for (let index of arr.keys()) {
    if (index % 2 == 0) {
      str += "<tr style='background-color: #babfc4;'>";
    } else {
      str += "<tr style='background-color: #fcb450;'>";
    }
    for (let number of arr[index]) {
      str += `<td style = 'border-collapse: collapse; border: 1px solid; width: 30px; height: 30px;'>${number}</td>`;
    }
    str += "</tr>";
  }
  str += "</table>";
  return str;
}

// Currency Table
// Оформите задание Currency Table как функцию, без параметров, которая складывает полученные данные во
// внутренний двумерный массив, после чего отображает его используя функцию из задания For Table

const currencyTable = () => {
  fetch('https://open.er-api.com/v6/latest/USD').then(res => res.json())
    .then(data => {
      let arr = [];
      arr[0] = [''];
      for (let currency of Object.keys(data.rates)) {
        arr[0].push(currency);
      }
      for (let rowCurrency of Object.keys(data.rates)) {
        let rowArr = [rowCurrency];
        for (let columnCurrency of Object.keys(data.rates)) {
          rowArr.push(+(data.rates[rowCurrency] / data.rates[columnCurrency]).toFixed(2));
        }
        arr.push(rowArr);
      }
      document.write(forTable(arr));
    })
}
currencyTable();