将对象数组转换为跟随其子对象的新数组

Question

我有一个这样的数组var data = [    {        name: "Movies", info: "category_name",        content: [            { name: "Interstellar", info: "category_data" },            { name: "Dark Knight", info: "category_data" },        ]    },    {        name: "Music", info: "category_name",        content: [            { name: "Adams", info: "category_data" },            { name: "Nirvana", info: "category_data" },        ]    },    {        name: "Places", info: "category_name",        content: [            { name: "Jordan", info: "category_data" },            { name: "Punjab", info: "category_data" },        ]    },]并且想把它变成这样var transformedArray= [  { name: "Movies", info: "category_name" },  { name: "Interstellar", info: "category_data" },  { name: "Dark Knight", info: "category_data" },  { name: "Music", info: "category_name" },  { name: "Adams", info: "category_data" },  { name: "Nirvana", info: "category_data" },  { name: "Places", info: "category_name" },  { name: "Jordan", info: "category_data" },  { name: "Punjab", info: "category_data" },]我不知道适合这种情况的关键字是什么，我尝试将其映射到新数组中，但与我预期的不一样var newArr = []var manipulate = data.map(item => {    return (        newArr.push(item),        new1.map(items => {            return (                new1.push(items)            )        })    )})那么如何将“数据”操作为“transformedArray”

Answer 1

使用Array.prototype.flatMap(). 如果您的浏览器或 Node.js 版本本身不支持此功能，您可以根据规范在下面包含一个简单的 polyfill ：

if (!Array.prototype.flatMap) {

  Object.defineProperty(Array.prototype, 'flatMap', {

    configurable: true,

    writable: true,

    value: function flatMap (callback, thisArg = undefined) {

      return this.reduce((array, ...args) => {

        const element = callback.apply(thisArg, args);

        if (Array.isArray(element)) array.push(...element);

        else array.push(element);

        return array;

      }, []);

    }

  });

}

const data = [{name:'Movies',info:'category_name',content:[{name:'Interstellar',info:'category_data'},{name:'Dark Knight',info:'category_data'}]},{name:'Music',info:'category_name',content:[{name:'Adams',info:'category_data'},{name:'Nirvana',info:'category_data'}]},{name:'Places',info:'category_name',content:[{name:'Jordan',info:'category_data'},{name:'Punjab',info:'category_data'}]}];

const transformedArray = data.flatMap(({ content, ...o }) => [o, ...content]);

console.log(transformedArray);

Answer 2

您可以使用reducemethod 和 spread syntax来做到这一点...。

var data = [{"name":"Movies","info":"category_name","content":[{"name":"Interstellar","info":"category_data"},{"name":"Dark Knight","info":"category_data"}]},{"name":"Music","info":"category_name","content":[{"name":"Adams","info":"category_data"},{"name":"Nirvana","info":"category_data"}]},{"name":"Places","info":"category_name","content":[{"name":"Jordan","info":"category_data"},{"name":"Punjab","info":"category_data"}]}]

const result = data.reduce((r, {content, ...rest}) => {

  r.push({...rest}, ...content)

  return r;

}, []);

console.log(result);

您还可以使用concatandreduce代替扩展语法。

var data = [{"name":"Movies","info":"category_name","content":[{"name":"Interstellar","info":"category_data"},{"name":"Dark Knight","info":"category_data"}]},{"name":"Music","info":"category_name","content":[{"name":"Adams","info":"category_data"},{"name":"Nirvana","info":"category_data"}]},{"name":"Places","info":"category_name","content":[{"name":"Jordan","info":"category_data"},{"name":"Punjab","info":"category_data"}]}]

const result = data.reduce((r, {content, ...rest}) => r.concat(rest, content), []);

console.log(result);