未兑现承诺

Question

所以我对 JavaScript 还很陌生，我有一个充满名词的文本文档，并认为用这些名词创建 api 的好方法。我阅读了文件并将它们添加到列表中public List<Noun> getData() throws IOException {    Scanner sc = new Scanner(new     File("C:\\Users\\Admin\\Desktop\\nounlist.txt"));    List<Noun> nouns = new ArrayList();    while (sc.hasNextLine()) {        nouns.add(new Noun(sc.nextLine()));    }    return nouns;}这个列表我用 Gson 转换为 Json：@GET@Path("/nouns/amount=all")@Produces(MediaType.APPLICATION_JSON)@Consumes(MediaType.APPLICATION_JSON)public Response getAllNouns() throws IOException {          return Response.ok().entity(gson.toJson(nf.getData())).build();}然后我开始用 js 创建我的前端并尝试获取数据，但遇到了一个问题，说 uncaught in promise, type error, nouns.forEach is not a functionimport "bootstrap/dist/css/bootstrap.css";const root = document.getElementById("root");var url = "http://localhost:8084/CORSJavaJax-rs/api/noun/nouns/amount=all";var tbody = document.getElementById("tbody");var btn = document.getElementById("btnsend");// fetch(url)//   .then(res => res.json)//   .then(nouns => {//     var n = nouns.map(noun => {//       return "<tr>" + "<td>" + noun.name + "</td>" + "</tr>";//     });//     tbody.innerHTML = n.join("");//   });btn.addEventListener("click", function() {  fetch(url)    .then(res => res.json)    .then(nouns => {      console.log(nouns);      var n = nouns.forEach(noun => {        return "<tr>" + "<td>" + noun.name + "</td>" + "</tr>";      });      tbody.innerHTML = n.join("");    });});我尝试了 map 和 forEach 但没有成功，也许我错过了一些东西，或者有些东西我只是不明白为什么我不能映射数据。

Answer 1

对于您想要的，正确的用法是map调用，而不是forEach. ForEach 不返回值，它只是在集合上迭代。

您收到is not a function错误的原因很可能是由于缺少对res.json. 应该是res.json()。

btn.addEventListener("click", function() {

  fetch(url)

    .then(res => res.json())

    .then(nouns => {

      console.log(nouns);

      var n = nouns.map(noun => {

        return "<tr>" + "<td>" + noun.name + "</td>" + "</tr>";

      });

      tbody.innerHTML = n.join("");

    });

});