JSON aray中每个x对象的循环

Question

我正在研究这个小项目（扩展名），在那里我使用Rapidapi从JSON数组中获取数据，我能够获取数据。但是我不清楚并且不了解如何遍历整个数据集（最终我会尝试将其存储在本地存储中，但这是不相关的）

concrete：我想循环遍历整个数组，并显示整个数组中每个第二个数组的每个1ste对象。

JSON数组的示例

0:{4 items
"kanji":{6 items
"character":"一"  ----> this one
"meaning":{...}1 item
"strokes":{...}3 items
"onyomi":{...}2 items
"kunyomi":{...}2 items
"video":{...}3 items
}
"radical":{...}7 items
"references":{...}3 items
"examples":[...]9 items
}
1:{4 items
"kanji":{6 items
"character":"飼"  ----> or this one
"meaning":{...}1 item
"strokes":{...}3 items
"onyomi":{...}2 items
"kunyomi":{...}2 items
"video":{...}3 items
}
"radical":{...}7 items
"references":{...}3 items
"examples":[...]6 items
}

等等。

我尝试获取JSON数组并显示其对象。然后，我尝试将[1]数字更改为变量。但是我被困住了。我不知道如何创建一个随机生成器来选择数组的每个第一个对象，如上面的json数组所示。

var myfetch = fetch("https://kanjialive-api.p.rapidapi.com/api/public/kanji/all", {
  "method": "GET",
  "headers": {
    "x-rapidapi-host": "x",
    "x-rapidapi-key": "x"
  }
})

/** Parse response object
 * returns object parsed from json
 */
const getJsonFromRes = (res) => res.json();

/**  Logs some data. 
 * returns undefined
 */
//const logData = (data) => console.log(data[1].kanji.character);

/** Ignores its data parameter. Attempts to set an element to an uninitialized variable.
 */
const accessKanji = (data) => document.getElementById('kanji').innerHTML = data[1].kanji.character;

for (i in accessKanji()) {
  x += data[i].kanji.character + "<br>";
}

// print error to console. returns undefined.
const logError = (err) => console.log(err);

myfetch
  .then(getJsonFromRes)
  //.then(logData) 
  .then(accessKanji)
  .catch(logError);

我想每次随机获得一个新对象（字符对象）。 （我将如何激活它是我项目的另一步骤）

非常感谢您的指导或链接，可以很好地指导您！或举个例子当然很理想。

Answer 1

accessKanji()不返回已获取的对象。您还可以在顶层使用for循环，在accessKanji()完成之前调用fetch()，并且不传递任何数据。

您需要将该循环放入accessKanji()函数本身内。

const accessKanji = (data) => {
  let chars = data.map(el => el.kanji.character + "<br>").join("");
  document.getElementById('kanji').innerHTML = chars;
}