Блог

Главная - Вопросы по программированию - Как удалить подмассивы, но сохранить их содержимое в Javascript?

Как удалить подмассивы, но сохранить их содержимое в Javascript?

#javascript #arrays

#javascript #массивы

Вопрос:

У меня есть следующий массив объектов:

 const pages = [
  {
    posts: {
      pageInfo: { 
        hasNextPage: true 
      },
      edges: [
        { id: 1 },
        { id: 2 }
      ]
    }
  },
  {
    posts: {
      pageInfo: { 
        hasNextPage: true 
      },
      edges: [
        { id: 3 },
        { id: 4 }
      ]
    }
  },
]

Мне нужно сохранить только содержимое edges подмассивов, вот так:

 const postsOnly = [
  { id: 1 },
  { id: 2 },
  { id: 3 },
  { id: 4 }
]

Ближе всего я подошел к тому, чтобы:

 const postsOnly = pages.map( ( { posts } ) =>  posts.edges )

Но это оставляет мне подмассив для каждого исходного posts объекта, например, так:

 const postsOnly = [
  [
    { id: 1 },
    { id: 2 }
  ],
  [
    { id: 3 },
    { id: 4 }
  ]
]

Как я могу удалить эти подмассивы, но сохранить их содержимое?

Комментарии:

1. const postsOnly = pages.flatMap( ( { posts } ) => posts.edges )

2. Я думаю, это неправильный синтаксис

3. @MaheerAli Почему? wandbox.org/permlink/cpnHlHBXEzfnuscC

4. @ThomasSablik Привет, спасибо! Если вы опубликуете это как ответ, я пометлю его как правильный ответ.

5. Привет всем, спасибо за все ответы, но я понял, что исходный пример был неправильным, так как у меня было два разных объекта «posts» в родительском массиве (сейчас я это исправил), так что некоторые ответы, возможно, были введены в заблуждение этим. Во всяком случае, ответ @ThomasSablik сработал для меня!

Ответ №1:

 const pages = [{
  posts: {
    pageInfo: { 
      hasNextPage: true 
    },
    edges: [
      { id: 1 },
      { id: 2 }
    ]
  }},
  {
  posts: {
    pageInfo: { 
      hasNextPage: false 
    },
    edges: [
      { id: 3 },
      { id: 4 }
    ]
  },
}];

const postsOnly = pages.map( ( { posts } ) =>  posts.edges).flat();
console.log(postsOnly);

То, что вы делаете, это нормально, вам просто не хватает .flat()
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat

Комментарии:

1. Данные, которые вы используете, не являются тем, что было опубликовано OP. Посмотрите, что это единственный объект во всем массиве. Может быть, указать на это тоже

2. Вы правы, я понял, что это неправильно, когда я скопировал / вставил его. Сделает это.

Ответ №2:

Вы можете либо использовать map(...).flat() , либо flatMap(...) сгладить результат

 const pages = [
  {
    posts: {
      pageInfo: { 
        hasNextPage: true 
      },
      edges: [
        { id: 1 },
        { id: 2 }
      ]
    }
  },
  {
    posts: {
      pageInfo: { 
        hasNextPage: true 
      },
      edges: [
        { id: 3 },
        { id: 4 }
      ]
    }
  },
];

const postsOnly = pages.map( ( { posts } ) =>  posts.edges );
const postsOnly2 = pages.flatMap( ( { posts } ) =>  posts.edges );
const postsOnly3 = pages.map( ( { posts } ) =>  posts.edges ).flat();

console.log(postsOnly);
/* Output: 
[ [ { id: 1 }, { id: 2 } ], [ { id: 3 }, { id: 4 } ] ]
*/
console.log(postsOnly2);
/* Output:
[ { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 } ]
*/
console.log(postsOnly3);
/* Output:
[ { id: 1 }, { id: 2 }, { id: 3 }, { id: 4 } ]
*/