Retour un nouvel objet avec des propriétés supplémentaires en JavaScript

Question

J'ai un objet

usersById: { 
    1: { name: 'John' }, 
    2: { name: 'Michelle' }, 
    ... 
} 

Je veux retourner le même objet, mais d'abord remplir l'objet à id = 2 avec une nouvelle propriété age, mais coller à immutabilité.

Je pense que ce serait quelque chose comme

return { 
    ...usersById, 
    ...usersById[2].age = 40 
} 

mais je reçois une erreur In this environment the sources for assign MUST be an object. This error is a performance optimization and not spec compliant.

Sinon, je pense que ce devrait être quelque chose comme

return Object.keys(usersById).map(userId => { 
    if (userId === 2) { 
    return { 
     ...usersById[2], 
     ...age = 40 
    } 
    } 
    return usersById[userId] 
}) 

mais il retourne un tableau et non un objet.

Answer 1

Vous avez la bonne idée mais la mauvaise syntaxe. Essayez ceci:

return { 
    ...usersById, 
    2: { 
    ...usersById[2], 
    age: 40 
    } 
} 

Ou si la clé est dynamique, vous pouvez le faire:

let key = 2; 
return { 
    ...usersById, 
    [key]: { 
    ...usersById[key], 
    age: 40 
    } 
} 

Answer 2

Vous pouvez faire votre propre fonction pour retourner un même objet avec des valeurs peuplées

Exemple simple:

var usersById = { 
 
    1: { name: 'John' }, 
 
    2: { name: 'Michelle' }, 
 
} 
 

 
usersById = oneLevelDeepAssign(usersById,2,{age:21}) 
 

 

 
function oneLevelDeepAssign(object, key, objectToAssign){ 
 

 
    return Object.assign({},object,{[key]:Object.assign({},object[key],objectToAssign)}) 
 

 
} 
 

 
console.log(usersById);