Comment modifier la valeur de l'objet qui se trouve à l'intérieur d'un tableau à l'aide de JavaScript?

Tout en travaillant avec JavaScript, les développeurs peuvent avoir besoin de mettre à jour les données dynamiquement. C'est à l'intérieur du tableau, de l'objet ou d'un tableau d'objets. Un tableau est un groupe ou une collecte de valeurs, et chaque valeur peut être de n'importe quel type de données, y compris les objets. Pour modifier la valeur d'un objet à l'intérieur d'un tableau, accédez d'abord à l'objet, puis modifiez ses propriétés. En JavaScript, plusieurs méthodes prédéfinies existent pour modifier la valeur d'un objet à l'intérieur d'un tableau.

Ce tutoriel démontrera les approches pour modifier la valeur d'un objet à l'intérieur d'un tableau en javascript.

Comment modifier / mettre à jour la valeur d'un objet qui se trouve à l'intérieur d'un tableau à l'aide de JavaScript?

Pour modifier la valeur d'un objet qui se trouve à l'intérieur d'un tableau, utilisez les méthodes prédéfinies JavaScript suivantes:

• Méthode findIndex ()
• Méthode map () avec l'opérateur de diffusion
• Find () Méthode
• For-Of Loop

Méthode 1: Modifier la valeur de l'objet qui se trouve à l'intérieur d'un tableau à l'aide de la méthode «findIndex ()»

Pour modifier la valeur d'un objet à l'intérieur du tableau, utilisez le «findIndex ()" méthode. Cette méthode trouve l'index de l'élément dans un tableau qui remplit la condition certaine. Pour spécifier la condition, il utilise une fonction de rappel.

Syntaxe
Suivez la syntaxe donnée pour modifier la valeur d'un objet en utilisant la méthode findIndex ():

ArrayObject.findIndex (obj =>
//condition
);

Exemple
Créez un tableau contenant différents objets:

var arrobj = [id: 5, nom: "Mayer", âge: 25,
id: 9, nom: "Paul", âge: 26,
id: 12, nom: "Steven", âge: 20]

Appelez la méthode FindIndex () avec la fonction de rappel qui vérifie l'ID des objets équivalents à «12», Et stockez l'index de l'objet dans une variable«getindex»:

const gentindex = arrobj.findIndex (obj =>
Retour OBJ.id === 12;
);

Modifier la valeur de la propriété "âge«D'objet:

arrobj [getindex].âge = 24;

Enfin, imprimez le tableau mis à jour d'objets sur la console:

console.log ("Le tableau d'objet mis à jour est:");
console.log (arrobj);

La sortie indique que la valeur de «âge«De l'objet dont l'identifiant est 12 a été changé avec succès par rapport à«20" pour "24»:

Méthode 2: Modifier la valeur de l'objet qui se trouve à l'intérieur d'un tableau à l'aide de la méthode «map ()» avec l'opérateur de diffusion

Utilisez le «carte()«Méthode avec le«opérateur de propagation”Pour modifier la valeur de l'objet à l'intérieur d'un tableau. «Map ()» est utilisé pour créer un nouveau tableau en appelant une fonction sur chaque élément d'un tableau existant. Tandis que l'opérateur de diffusion permet de diffuser ou de copier des éléments de tableau dans un nouveau tableau ou les arguments d'un appel de fonction. La méthode «map ()» ne modifie pas / modifie le tableau d'origine mais il publie un nouveau tableau avec les éléments modifiés.

Syntaxe
Pour modifier la valeur d'un objet à l'aide de la méthode map () avec l'opérateur d'écart, utilisez la syntaxe suivante:

ArrayObject.map (obj =>
if (condition)
return … obj, key: newValue;

retour obj;
);

Exemple
Appelez la méthode map () avec l'opérateur de diffusion pour modifier le nom de l'objet dont l'ID est «9»:

const newobjectarr = arrobj.map (obj =>
si (obj.id === 9)
return … obj, nom: 'Alice';

retour obj;
);

Imprimez le tableau modifié de l'objet sur la console:

console.log (NewObjectArtr);

La propriété "nom«De l'objet dont l'ID est«9«A été changé par rapport à«Paul" pour "Alice»:

Méthode 3: Modifier la valeur de l'objet qui se trouve à l'intérieur d'un tableau à l'aide de la méthode «find ()»

Pour modifier la valeur d'un objet à l'intérieur d'un tableau, utilisez le «trouver()" méthode. Il est utilisé pour trouver l'élément dans un tableau qui remplit une condition donnée. Il étend la valeur de l'élément s'il satisfait la condition. Sinon, ça donne «indéfini, «Indiquant aucun élément de ce type n'est trouvé.

Syntaxe
Utilisez la syntaxe donnée pour la méthode find () pour trouver l'élément dans un tableau:

ArrayObject.trouver (obj =>
//condition
);

Exemple
Invoquez la méthode Find () pour trouver l'objet dont l'ID est «5"Et stockez l'objet dans une variable"findindex»:

const FindIndex = arrobj.trouver (obj =>
Retour OBJ.id === 5;
);

Vérifiez si la variable «findindex» n'est pas égale à «indéfini"Signifie, si l'objet est trouvé, modifiez la valeur de la propriété"nom«De l'objet:

if (findIndex !== Undefined)
findindex.name = 'John';

Enfin, imprimez l'objet sur la console:

console.log (findIndex);

La sortie affiche uniquement l'objet spécifié en modifiant sa valeur:

Méthode 4: Modifier la valeur de l'objet qui se trouve à l'intérieur d'un tableau à l'aide de la boucle «for»

Vous pouvez également utiliser le «pour”Boucle pour modifier la valeur d'un objet à l'intérieur du tableau. Il est utilisé pour itérer sur le tableau d'objets et vérifier la condition pour modifier la valeur de l'objet. Après avoir accédé et modifié la valeur de l'objet, terminez la boucle à l'aide du «casser" mot-clé.

Syntaxe
Suivez la syntaxe donnée pour la boucle «For-Of»:

pour (const obj de ArrayObject)
if (condition)
//déclaration
casser;

Exemple
Utilisez la boucle FOR-OF et vérifiez l'objet dont l'ID est «5"Et changez le"âge" pour "27»:

for (const obj of arrobj)
si (obj.id === 5)
obj.âge = 27;
casser;

Imprimez l'objet mis à jour à l'intérieur du tableau sur la console:

console.log (arrobj);

Sortir

Nous avons rassemblé toutes les informations essentielles pertinentes pour l'évolution de la valeur d'un objet qui se trouve à l'intérieur du tableau en javascript.

Conclusion

Pour modifier la valeur d'un objet qui se trouve à l'intérieur d'un tableau, utilisez les méthodes prédéfinies JavaScript, y compris le «findIndex (), "carte()"Méthode avec"opérateur de propagation","trouver()«Méthode, ou le«pour" boucle. Ces méthodes ont réussi à modifier les valeurs d'un objet à l'intérieur d'un tableau. Ce tutoriel a démontré les différentes approches pour modifier la valeur d'un objet qui se trouve à l'intérieur d'un tableau en javascript.