嵌套对象和数组解构

时间:2016-09-01 04:02:41

标签: javascript arrays typescript ecmascript-6

我正在尝试使用解构将对象转换为更精简的版本。

我的对象包含一个嵌套数组,它也包含对象,从这个数组中我只想要几个字段。

我可以做嵌套对象解构很好,并且数组解构很好但不在一起吗?

我目前的尝试看起来像这样:

var data = {
    title: "title1",
    bar: "asdf",
    innerData: [
       {
        title: "inner-title1",
        foo: "asdf"
       },
       {
        title: "inner-title2",
        foo: "asdf"
       }
    ]
};

var { title, innerData: [ { title} ] } = data;

console.log(title);

for (var { title} of innerData) {
  console.log(title);
}

但是会收到一条消息innerData is not defined.

我想要的结果可能是:

{
    title: "title1",
    innerData: [
       {
        title: "inner-title1"
       },
       {
        title: "inner-title2"
       }
    ]
};

3 个答案:

答案 0 :(得分:4)

你的解构并没有按照你的想法行事。

var { title, innerData: [ { title} ] } = data;

(基本上)等同于

var title = data.title;
var title = data.innerData[0].title;

解构会拉出单个值,它不会为您映射数组。如果这是你想要的,你需要手动完成。

答案 1 :(得分:4)

您可以将变量名称调整为定义innerData以外的标识符;使用.map()JSON.stringify()JSON.parse()来过滤title对象的innerData属性

var {title, titles = data.innerData.map(o => ({title:o.title}))} = data;

维护innerData变量名称可以使用对象的数组解析

var [title, innerData] = [data.title, data.innerData.map(o => ({title:o.title}))];

使用JSON.stringify()JSON.parse()

var [title, innerData] = JSON.parse(JSON.stringify([data.title, data.innerData], ["title"]));

修改

如果要求在title内创建包含所有data属性的数组,则可以使用JSON.stringify()将替换器数组设置为["title"]JSON.parse(),传播元件

var data = {
    title: "title1",
    bar: "asdf",
    innerData: [
       {
        title: "inner-title1",
        foo: "asdf"
       },
       {
        title: "inner-title2",
        foo: "asdf"
       }
    ]
};

var innerData = JSON.parse(JSON.stringify([data, ...data.innerData], ["title"]))
                                                                      
console.log(innerData);

答案 2 :(得分:1)

根据@loganfsmyth的建议,我将分两步完成。

var { title } = data;

for (var { title } of data.innerData) {
  console.log( title );
}

编辑:我从旧的

构建新json对象的最终解决方案
const request = { innerData: [] };

({ title } = this.data);

for (const { title} of this.data.innerData) {
    request.innerData.push({
        title
    });
}