如何遍历用 flat() 创建的数组数组?

RB50

我使用 flat() 将 3 个 JSON 文件组合成一个数组,然后循环遍历该数组以在控制台中输出其内容。它输出从以下 3 个 JSON 文件创建的数组数组。

这是控制台输出:

{books: Array(3)}books: (3) [{…}, {…}, {…}]__proto__: Object
{movies: Array(3)}movies: (3) [{…}, {…}, {…}]__proto__: Object
{posts: Array(3)}posts: (3) [{…}, {…}, {…}]__proto__: Object

我在遍历每个内部数组以访问它们的属性/值时遇到问题。任何人都可以提供一些帮助吗?谢谢!

这是我的代码...

爪哇脚本:

let finalResult;

const urls = ['books', 'movies', 'posts'];

Promise.all(
urls.map(url =>
    fetch('json/' + url + '.json')
        .then(e => e.json())
    )
).then(data => {
    finalResult = data.flat();

    finalResult.forEach(array => {
      console.log(array); // returns the array of arrays I want to loop through to get the property-values
    });
});

书籍.json

{
  "books": [
    {
      "title": "Eloquent JavaScript, Second Edition",
      "description": "JavaScript lies at the heart of almost every modern web application, from social apps to the newest browser-based games. Though simple for beginners to pick up and play with, JavaScript is a flexible, complex language that you can use to build full-scale applications."
    },
    {
      "title": "Learning JavaScript Design Patterns",
      "description": "With Learning JavaScript Design Patterns, you'll learn how to write beautiful, structured, and maintainable JavaScript by applying classical and modern design patterns to the language. If you want to keep your code efficient, more manageable, and up-to-date with the latest best practices, this book is for you."
    },
    {
      "title": "Speaking JavaScript",
      "description": "Like it or not, JavaScript is everywhere these days-from browser to server to mobile-and now you, too, need to learn the language or dive deeper than you have. This concise book guides you into and through JavaScript, written by a veteran programmer who once found himself in the same position."
    }
  ]
}

电影.json

{
  "movies": [
    {
      "title": "History of the World Part I",
      "description": "A 1981 American sketch comedy film written, produced, and directed by Mel Brooks. Brooks also stars in the film, playing five roles: Moses, Comicus the stand-up philosopher, Tomás de Torquemada, King Louis XVI, and Jacques, le garçon de pisse."
    },
    {
      "title": "Jaws",
      "description": "a 1975 American thriller film directed by Steven Spielberg, based on Peter Benchley's 1974 novel of the same name. In the film, a man-eating great white shark attacks beachgoers at a summer resort town, prompting police chief Martin Brody (Roy Scheider) to hunt it with the help of a marine biologist (Richard Dreyfuss) and a professional shark hunter (Robert Shaw). "
    },
    {
      "title": "The Exorcist",
      "description": "When a 12-year-old girl is possessed by a mysterious entity, her mother seeks the help of two priests to save her."
    }
  ]
}

帖子.json

{
  "posts": [
    {
      "title": "Done",
      "description": "I can't take it anymore."
    },
    {
      "title": "Finished",
      "description": "The story of a young man who has finished his sandwich."
    },
    {
      "title": "Concluded",
      "description": "An epic take of a meeting that has conluded."
    }
  ]
}
湿婆KV

使用Object.entries和解构。

const finalResult = [{"books":[{"title":"Eloquent JavaScript, Second Edition","description":"JavaScript lies at the heart of almost every modern web application, from social apps to the newest browser-based games. Though simple for beginners to pick up and play with, JavaScript is a flexible, complex language that you can use to build full-scale applications."},{"title":"Learning JavaScript Design Patterns","description":"With Learning JavaScript Design Patterns, you'll learn how to write beautiful, structured, and maintainable JavaScript by applying classical and modern design patterns to the language. If you want to keep your code efficient, more manageable, and up-to-date with the latest best practices, this book is for you."},{"title":"Speaking JavaScript","description":"Like it or not, JavaScript is everywhere these days-from browser to server to mobile-and now you, too, need to learn the language or dive deeper than you have. This concise book guides you into and through JavaScript, written by a veteran programmer who once found himself in the same position."}]},
    {"movies":[{"title":"History of the World Part I","description":"A 1981 American sketch comedy film written, produced, and directed by Mel Brooks. Brooks also stars in the film, playing five roles: Moses, Comicus the stand-up philosopher, Tomás de Torquemada, King Louis XVI, and Jacques, le garçon de pisse."},{"title":"Jaws","description":"a 1975 American thriller film directed by Steven Spielberg, based on Peter Benchley's 1974 novel of the same name. In the film, a man-eating great white shark attacks beachgoers at a summer resort town, prompting police chief Martin Brody (Roy Scheider) to hunt it with the help of a marine biologist (Richard Dreyfuss) and a professional shark hunter (Robert Shaw). "},{"title":"The Exorcist","description":"When a 12-year-old girl is possessed by a mysterious entity, her mother seeks the help of two priests to save her."}]},
    {"posts":[{"title":"Done","description":"I can't take it anymore."},{"title":"Finished","description":"The story of a young man who has finished his sandwich."},{"title":"Concluded","description":"An epic take of a meeting that has conluded."}]}]

finalResult.forEach(obj => {
  // destructure first entry key, value pair.
  const [[type, array]] = Object.entries(obj);
  console.log('-----------> Type: ', type);
  array.forEach(item => console.log(item));
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章