Comment lister les données dans une table en fonction de l'ID après l'avoir obtenu depuis une source différente en javascript?

Question

J'ai 3 sources (A, B, C) pour obtenir différentes données mais elles ont un PID de champ commun et ces 3 sources sont indépendantes. Comme, quand je présente ces données sur l'interface utilisateur peut être le paramètre de B peut être changer mais il retournera des données avec PID. Quoi qu'il en soit, les changements survenus dans les sources devraient s'ajuster avec les autres colonnes et doivent afficher les données en fonction du PID.

Obtenir des données de la source:

A: pid, nom, DATA_A

B: pid, DATA_B

C: pid, data_c

Présentation devrait être:

pid - data_a - DATA_B - data_c

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

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

Je pensais à l'index sur peut être dans la troisième source la valeur de pid-2 est vide.

Avez-vous des suggestions à propos de ce problème?

échantillon Format des données:

var sourceA = [{pid: 1, DATA_A: 23, données_x: 23}, {pid: 2, DATA_A: 23, données_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}];

:: Modifier

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 }];

et je veux comme ça:

[ 
 
    { 
 
    "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

Vous pouvez utiliser l'objet ECMAScript6.assigner:

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);

EDIT:

Dans les sources de cas sont tableau, il devrait être:

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);