Mapper le tableau à l'objet en utilisant la propagation

Question

Je voudrais transformer le tableau suivant en un objet légèrement modifié (voir ci-dessous). J'essaie aussi de m'entraîner en utilisant l'opérateur de propagation, mais je n'ai pas réussi à comprendre comment le faire. J'essaie d'éviter d'utiliser lodash (à des fins éducatives).

tableau de départ:

var arr = [ 
    { mainkey: 'John', val1: 'ABC', val2: '..', val3: '..' }, 
    { mainkey: 'Mary', val1: 'DEF', val2: '..', val3: '..' }, 
    { mainkey: 'Ann', val1: 'XYZ', val2: '..', val3: '..' } 
    ]; 

pour objet final:

newObj = { 
    John: {val1: 'ABC', val2: '..', val3: '..' }, 
    Mary: {val1: 'DEF', val2: '..', val3: '..' }, 
    Ann: {val1: 'XYZ', val2: '..', val3: '..' } 
} 

Sans utiliser l'opérateur de diffusion, cela devient proche, mais pas là où je dois être:

var result = arr.reduce(function(map, obj) { 
    map[obj.mainkey] = obj.val1; 
    // map[obj.mainkey] = { obj.val1, obj.val2 }; <-- DOESNT WORK 
    return map; 
}, {}); 

Avec l'opérateur de propagation tout ce que je fais échoue.

Autres messages avec un contenu utile:

• React object spread (ES6) returned from map
• Convert object array to hash map, indexed by an attribute value of the Object

Answer 1

Réponse courte

const newObj = arr.reduce(
    (acc, { mainkey, ...rest }) => ({ ...acc, [mainkey]: rest }), 
    {} 
) 

Expliqué

Nous appelons Array.prototype.reduce(), et pour chaque objet dans le tableau, déconstruisant mainkey du reste des propriétés (si mainkey pourrait être John et rest pourrait être quelque chose comme ceci: {val1: 'ABC', val2: '..', val3: '..' }.

Ensuite, nous voulons revenir l'accumulateur avec un changement profond, nous utilisons donc l'opérateur propagation, puis en réglant la propriété du interploated mainkey ([mainkey]) être rest.

Answer 2

changer simplement ..

var result = arr.reduce(function(map, obj) { 
     map[obj.mainkey] = { 
      val1: obj.val1, 
      val2: obj.val2, 
     }; 
     return map; 
    }, {});   

MISE À JOUR: ajouter une autre version dynamique.

var result = arr.reduce(function(map, obj) { 
    let targetProps = Object.getOwnPropertyNames(obj).filter(
     (prop) => prop !== "mainkey" 
    ); 
    map[obj.mainkey] = {}; 
    targetProps.forEach((prop) => { 
     map[obj.mainkey][prop] = obj[prop]; 
    }); 
    return map; 
}, {});