Question

我正在努力遍历在此端点找到的数据-https://blockchain.info/ticker。

我使用Axios来获取数据，并使用Object.keys返回对象属性。然后，我使用Object.entries来获取值。

将这些值映射到变量然后可以用于在HTML表中显示数据的最佳方法是什么？

 axios.get('https://blockchain.info/ticker') 
      .then((response) => {

        const data = response.data;
        console.log(data);

        Object.keys(data).forEach(function (key) {
          console.log(data[key]);

          // console.log(Object.entries(data[key]));
          Object.entries(data[key]).forEach(function (item) {
            console.log(item[0] + ' : ' + item[1]);
          });

        });

      },
      (error) => {
        console.log(error);
      });

Answer 1

根据API返回的数据结构，我建议循环访问第一个条目的键以创建标头。

然后为每个条目创建一个新行，在其中将货币和嵌套对象的值添加到连续的单元格中。

=ARRAYFORMULA(IFERROR(TEXTJOIN(", ", 1, UNIQUE(QUERY(
 SUBSTITUTE(QUERY(TRIM(IFERROR(SPLIT(FLATTEN(IF('Staff availability'!E$2:O="",,TRANSPOSE(QUERY(TRANSPOSE({"♦"&'Staff availability'!A$2:A, "♦♠"&TO_TEXT('Staff availability'!B$2:B), "♦"&'Staff availability'!C$2:D}),,9^9))&"♦"&'Staff availability'!E$2:O)), "♦"))), 
 "where Col5 = '"&QUERY(FILTER(INDIRECT("B1:B"&ROW()), INDIRECT("A1:A"&ROW())="-"), "offset "&COUNTA(FILTER(INDIRECT("B1:B"&ROW()), INDIRECT("A1:A"&ROW())="-"))-1)&"' 
     or Col5 contains '"&TRIM(A4)&"'"), "♠", ), 
 "select Col1 
  where Col2 matches '"&TEXTJOIN("|", 1, TO_DATE(VLOOKUP(A4, {'Winter Trips'!A:K; 'Spring Trips'!A:K}, SEQUENCE(1, 10, 2), 0)))&"' 
  order by Col4 desc", 0))), "no one"))

const data = {
  "USD" : {"15m" : 15573.3, "last" : 15573.3, "buy" : 15573.3, "sell" : 15573.3, "symbol" : "$"},
  "AUD" : {"15m" : 21457.05, "last" : 21457.05, "buy" : 21457.05, "sell" : 21457.05, "symbol" : "$"},
  "BRL" : {"15m" : 83547.66, "last" : 83547.66, "buy" : 83547.66, "sell" : 83547.66, "symbol" : "R$"},
  "CAD" : {"15m" : 20285.08, "last" : 20285.08, "buy" : 20285.08, "sell" : 20285.08, "symbol" : "$"},
  "CHF" : {"15m" : 14014.26, "last" : 14014.26, "buy" : 14014.26, "sell" : 14014.26, "symbol" : "CHF"},
  "CLP" : {"15m" : 1.170332014E7, "last" : 1.170332014E7, "buy" : 1.170332014E7, "sell" : 1.170332014E7, "symbol" : "$"},
  "CNY" : {"15m" : 102961.34, "last" : 102961.34, "buy" : 102961.34, "sell" : 102961.34, "symbol" : "¥"},
  "DKK" : {"15m" : 97734.47, "last" : 97734.47, "buy" : 97734.47, "sell" : 97734.47, "symbol" : "kr"},
  "EUR" : {"15m" : 13105.1, "last" : 13105.1, "buy" : 13105.1, "sell" : 13105.1, "symbol" : "€"},
  "GBP" : {"15m" : 11836.07, "last" : 11836.07, "buy" : 11836.07, "sell" : 11836.07, "symbol" : "£"},
  "HKD" : {"15m" : 120733.04, "last" : 120733.04, "buy" : 120733.04, "sell" : 120733.04, "symbol" : "$"},
  "INR" : {"15m" : 1152130.87, "last" : 1152130.87, "buy" : 1152130.87, "sell" : 1152130.87, "symbol" : "₹"},
  "ISK" : {"15m" : 2144288.09, "last" : 2144288.09, "buy" : 2144288.09, "sell" : 2144288.09, "symbol" : "kr"},
  "JPY" : {"15m" : 1608222.56, "last" : 1608222.56, "buy" : 1608222.56, "sell" : 1608222.56, "symbol" : "¥"},
  "KRW" : {"15m" : 1.747166782E7, "last" : 1.747166782E7, "buy" : 1.747166782E7, "sell" : 1.747166782E7, "symbol" : "₩"},
  "NZD" : {"15m" : 23004.93, "last" : 23004.93, "buy" : 23004.93, "sell" : 23004.93, "symbol" : "$"},
  "PLN" : {"15m" : 59039.79, "last" : 59039.79, "buy" : 59039.79, "sell" : 59039.79, "symbol" : "zł"},
  "RUB" : {"15m" : 1205867.33, "last" : 1205867.33, "buy" : 1205867.33, "sell" : 1205867.33, "symbol" : "RUB"},
  "SEK" : {"15m" : 134592.5, "last" : 134592.5, "buy" : 134592.5, "sell" : 134592.5, "symbol" : "kr"},
  "SGD" : {"15m" : 21000.68, "last" : 21000.68, "buy" : 21000.68, "sell" : 21000.68, "symbol" : "$"},
  "THB" : {"15m" : 476641.29, "last" : 476641.29, "buy" : 476641.29, "sell" : 476641.29, "symbol" : "฿"},
  "TRY" : {"15m" : 132762.41, "last" : 132762.41, "buy" : 132762.41, "sell" : 132762.41, "symbol" : "₺"},
  "TWD" : {"15m" : 445108.36, "last" : 445108.36, "buy" : 445108.36, "sell" : 445108.36, "symbol" : "NT$"}
};

const createTable = data => {
  const table = document.createElement('table');
  
  // Create headers.
  const headerRow = table.insertRow();
  
  // Empty cell for currency column.
  headerRow.insertCell();
  
  // Get the keys of the first item.
  Object.keys(Object.values(data)[0]).forEach(key => {
    const header = document.createElement('th');
    header.textContent = key;
    headerRow.append(header);
  });
  
  // Create rows of data.
  Object.entries(data).forEach(([ currency, values ]) => {
    const row = table.insertRow();
    const header = document.createElement('th');
    header.textContent = currency;
    row.append(header);
    Object.values(values).forEach(value => {
      row.insertCell().textContent = value;
    });
  });
  
  return table;
};

const table = createTable(data);
document.body.append(table);

遍历数组对象以获取和显示值

1 个答案: