Github API преобразование данных перфокарты

Question

Я хочу создать график, который отображает информацию, предоставляемую Github PunchCard, аналогично этому скрипту Python , но вместо этого с JavaScript, используя D3.js. Я получаю информацию из API Github таким образом , используя GET /repos/:owner/:repo/stats/punch_card

Сейчас я застрял в том, как изменить ответ, чтобы собрать данные и классифицировать их по дням / часам, но, очевидно, я не могу получить доступ к массиву. Пока мой код выглядит следующим образом:

const showGithubData = (user, repo) => {
    console.log(`Querying user  ${user} and repo ${repo}`);
    fetchPunchCard(repoUser.value, repoName.value).then((res) => {
        console.log(res);         
    })
};

const fetchPunchCard = async (username, repository) => {
   /*  GET / repos /: owner /: repo / stats / punch_card */
    const url = `https://api.github.com/repos/${username}/${repository}/stats/punch_card`;

    const api_call = await fetch(url);

    const data = await api_call.json();
    return { data }
};

Я возвращаю правильные значения, но затем не могу получить к ним доступ в той же функции. Если в showGithubData () я выполняю console.log (res [0]), он говорит undefined , однако при выполнении console.log (res) я вижу, что он возвращает Array of Arrays (3), например это:

{data: Array(168)}
data: Array(168)
[0 … 99]
    0: Array(3)
        0: 0
        1: 0
        2: 0
      length: 3
      __proto__: Array(0)
    1: (3) [0, 1, 0]
    2: (3) [0, 2, 0]

Я хочу получить доступ ко всем этим позициям (0 - день, 1 - час, 2 - количество коммитов), чтобы создавать свои графики, но я не знаю, почему не могу.

Я действительно ценю любую помощь.

Answer 1

Иногда объект, который мы видим напечатанным на console.log, не является точным. Когда я сталкиваюсь с этой проблемой (я не могу найти ключ, который должен быть там, и вижу в console.log), я выполняю следующие 2 шага:

1. Напечатайте тип : чтобы убедиться, что это объект json, а не просто строка, в данном случае это был объект: console.log(typeof res); > object
2. Печать всех ключей объекта : иногда фактический ключ не отображается, но все еще там: console.log(Object.keys(res)); > [ 'data' ]

И, как вы можете видеть, мы нашли наше решение с шагом 2, ключ для доступа ко всем значениям - data, поэтому в вашем случае для доступа к этим значениям нам нужно сделать res.data

IE: console.log(res.data[0]); > [ 0, 0, 0 ]