循环遍历对象的 JSON 数组并根据对象的匹配 ID 获取属性

Question

我的目标是如果 digital_assets 和 products 中的 id 匹配，则从 products 对象中获取 digital_assets 和 ProductName 的 URL 值。我能够遍历对象并获取 digital_assets 和 products 的值，但需要一些帮助才能根据 ID 比较这两个对象以获取 URL 和 ProductName 的值。以下是我到目前为止所做的。

var data = [{
        "digital_assets": [{
            "id": "AA001",
            "url": "https://via.placeholder.com/150"
        },{
            "id": "AA002",
            "url": "https://via.placeholder.com/150"
        }]
    }, {
        "products": [{
            "id": ["BB001", "AA001"],
            "ProductName": "PROD 485"
        },{
            "id": ["BB002", "AA002"],
            "ProductName": "PROD 555"
        }]
    }
];

$.each(data, function () {
    var data = this;
    //console.log(data);

    $.each(data.digital_assets, function () {
        var dAssets = this,
            id = dAssets['id'];
        // console.log(id);
    });

    $.each(data.products, function () {
        var proData = this,
            prod_id = proData['id'];
        // console.log(prod_id);

        $.each(prod_id, function () {
            var arr_id = this;
            console.log(arr_id);
        });
    });
});

我是否需要创建新数组并将值推送到新数组中？然后将这些数组 concat() 合并为一个。 ?位丢失任何帮助将不胜感激。

Answer 1

这是您可以通过Array.reduce、Array.includes、Object.entries 和Array.forEach 执行此操作的一种方法：

var data = [{ "digital_assets": [{ "id": "AA001", "url": "https://via.placeholder.com/150" }, { "id": "AA002", "url": "https://via.placeholder.com/150" } ] }, { "products": [{ "id": ["BB001", "AA001"], "ProductName": "PROD 485" }, { "id": ["BB002", "AA002"], "ProductName": "PROD 555" } ] } ]

const result = data.reduce((r,c) => { 
  Object.entries(c).forEach(([k,v]) => 
    k == 'digital_assets' 
     ? v.forEach(({id, url}) => r[id] = ({ id, url }))
     : v.forEach(x => Object.keys(r).forEach(k => x.id.includes(k) 
       ? r[k].ProductName = x.ProductName 
       : null))
  )
  return r
}, {})

console.log(Object.values(result))

Answer 2

您可以使用Array.prototype.find、Array.prototype.includes 和Array.prototype.map 非常优雅地实现这一目标。

let data = [
   {
    "digital_assets": [
      {
        "id": "AA001",
        "url": "https://via.placeholder.com/150"
      },
      {
        "id": "AA002",
        "url": "https://via.placeholder.com/150"
      }
    ]
  },
  {
    "products": [
      {
        "id": ["BB001", "AA001"],
        "ProductName": "PROD 485"
      },
      {
        "id": ["BB002","AA002"],
        "ProductName": "PROD 555"
      }
    ]
  }
];

// Find the 'digital_assets' array
let assets = data.find(d => d['digital_assets'])['digital_assets'];

// Find the 'products' array
let products = data.find(d => d['products'])['products'];

// Return an array of composed asset objects
let details = assets.map(a => {
  return {
    id : a.id,
    url : a.url
    name : products.find(p => p.id.includes(a.id)).ProductName
  };
});

console.log(details);

Answer 3

更改答案以满足您的需求：

var data = [
       {
        "digital_assets": [
          {
            "id": "AA001",
            "url": "https://via.placeholder.com/150"
          },
          {
            "id": "AA002",
            "url": "https://via.placeholder.com/150"
          }
        ]
      },
      {
        "products": [
          {
            "id": ["BB001", "AA001"],
            "ProductName": "PROD 485"
          },
          {
            "id": ["BB002","AA002"],
            "ProductName": "PROD 555"
          }
        ]
      }
    ]
let matchingIds = [];
let data_assetsObject = data.find(element => {
    return Object.keys(element).includes("digital_assets")
})
let productsObject = data.find(element => {
    return Object.keys(element).includes("products")
})
data_assetsObject["digital_assets"].forEach(da => {
  productsObject["products"].forEach(product => {
    if (product.id.includes(da.id)){
      matchingIds.push({
        url: da.url,
        productName: product.ProductName
      })
    }
  })
})
console.log(matchingIds);

工作小提琴：https://jsfiddle.net/z2ak1fvs/3/

希望对您有所帮助。如果您不想使用新数组，也可以将相应的数据存储在您正在循环的元素中。

编辑： 我想我知道为什么我被否决了。我的示例通过使数据成为对象而不是数组来工作。更改了 sn-p 以更清楚地显示这一点。 为什么 data 还是一个数组？有什么原因吗？或者您可以将其转换为对象吗？

编辑 nr2： 更改了代码以满足期望，因为我根据您的 cmets 理解它们。它现在使用您的数据结构，无论数据是什么，您现在都可以搜索包含 digital_assets / products 属性的对象。

干杯

Answer 4

https://jsfiddle.net/2b1zutvx/

使用地图。

 var myobj = data[0].digital_assets.map(function(x) {
    return {
        id: x.id,
        url: x.url,
        ProductName: data[1].products.filter(f => f.id.indexOf(x.id) > -1).map(m => m.ProductName)
    };
});