如何在javascript中从不同的来源获取数据后，根据ID列出数据表中的数据？

Question

我有3个来源（A，B，C）获取不同的数据，但他们有一个共同的字段PID，这3个来源是独立的。比如，当我在UI上呈现这些数据时，可能会改变参数B，但它会返回带有PID的数据。无论发生什么变化，它都应该根据PID来调整其他列，并且需要显示数据。

从源获取数据：

甲：PID，名称，DATA_A

B：PID，DATA_B

C：PID，DATA_C

演示应该是：

pid - data_a - DATA_B - DATA_C

1 ----- ------ 23 34 ------- 35

2 ----- ------- 24 45 ------- 56

我一直在想索引可能在第三源码中pid-2的值是空白的。

有关此问题的任何建议？

示例数据格式：

变种sourceA = [{PID：1，DATA_A：23，数据_x：23}，{PID：2，DATA_A：23，数据_x：23}]; var sourceB = [{pid：1，data_b：34，data_y：34}，{pid：2，data_b：34，data_y：34}]; var sourceC = [{pid：1，data_c：35，data_z：34}，{pid：2，data_c：35，data_z：34}];

编辑::

var sourceA = [{ pid: 1, data_a: 23, data_x: 23},{ pid: 2, data_a: 23 ,data_x: 23}]; 
 

 
var sourceB = [{ pid: 1, data_a: 34, data_x: 34 },{ pid: 2, data_a: 34, data_x: 34 }]; 
 

 
var sourceC = [{ pid: 1, data_a: 35, data_x: 34 },{ pid: 2, data_a: 35, data_x: 34 }];

，我喜欢这样吃：

[ 
 
    { 
 
    "pid": 1, 
 
    "array": [ 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     }, 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     }, 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     } 
 
    ] 
 
    }, 
 
    { 
 
    "pid": 2, 
 
    "array": [ 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     }, 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     }, 
 
     { 
 
     "data_a": 33, 
 
     "data_x": 30 
 
     } 
 
    ] 
 
    },

Answer 1

您可以使用ECMAScript6的对象。分配：

sourceA = { pid: 1, data_a: 23 }; 
 
sourceB = { pid: 1, data_b: 34 }; 
 
sourceC = { pid: 1, data_c: 35 }; 
 

 
var result = Object.assign({}, sourceA, sourceB, sourceC); 
 
console.log(result);

编辑：

如果源阵列，它应该是：

var sourceA = [{ pid: 1, data_a: 23, data_x: 23},{ pid: 2, data_a: 23 ,data_x: 23}]; 
 
var sourceB = [{ pid: 1, data_b: 34, data_y: 34 },{ pid: 2, data_b: 34, data_y: 34 }]; 
 
var sourceC = [{ pid: 1, data_c: 35, data_z: 34 },{ pid: 2, data_c: 35, data_z: 34 }]; 
 

 
var result = sourceA.map((obj, index) => Object.assign({}, sourceA[index], sourceB[index], sourceC[index])); 
 
console.log(result);