Ce tutoriel montrera les approches pour changer 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 dans un tableau à l'aide de JavaScript ?
Pour modifier la valeur d'un objet qui se trouve dans un tableau, utilisez les méthodes JavaScript prédéfinies suivantes :
Méthode 1: Modifier la valeur de l'objet qui se trouve dans un tableau à l'aide de la méthode 'findIndex ()'
Pour changer la valeur d'un objet à l'intérieur du tableau, utilisez le ' trouverIndex() ' méthode. Cette méthode trouve l'index de l'élément dans un tableau qui remplit la certaine condition. Pour spécifier la condition, il utilise une fonction de rappel.
Syntaxe
Suivez la syntaxe donnée pour modifier la valeur d'un objet à l'aide de la méthode findIndex() :
arrayObject. trouverIndex ( obj => {
//condition
} ) ;
Exemple
Créez un tableau contenant différents objets :
était tabObj = [ { identifiant : 5 , nom : 'Mayer' , âge : 25 } ,
{ identifiant : 9 , nom : 'Paul' , âge : 26 } ,
{ identifiant : 12 , nom : 'Steven' , âge : vingt } ]
Appelez la méthode findIndex() avec la fonction de rappel qui vérifie l'id des objets équivalents à ' 12 ', et stocker l'index de l'objet dans une variable ' obtenirIndex ” :
constante obtenirIndex = arrObj. trouverIndex ( obj => {retour obj. identifiant === 12 ;
} ) ;
Modifier la valeur de la propriété ' âge ” de l'objet :
tabObj [ obtenirIndex ] . âge = 24 ;
Enfin, imprimez le tableau d'objets mis à jour sur la console :
console. enregistrer ( 'Le tableau d'objets mis à jour est :' ) ;console. enregistrer ( tabObj ) ;
La sortie indique que la valeur de ' âge ' de l'objet dont l'id est 12 a été changé avec succès de ' vingt ' 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 Spread
Utilisez le ' carte() ' méthode avec le ' opérateur de propagation ” pour changer 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. Alors que l'opérateur de propagation permet de propager 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/ne change pas le tableau d'origine mais elle génère 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 spread, utilisez la syntaxe suivante :
si ( condition ) {
retour { ... obj , clé : nouvelle valeur } ;
}
retour obj ;
} ) ;
Exemple
Appelez la méthode map() avec l'opérateur spread pour changer le nom de l'objet dont l'id est ' 9 ” :
si ( obj. identifiant === 9 ) {
retour { ... obj , nom : 'Alice' } ;
}
retour obj ;
} ) ;
Imprimez le tableau modifié de l'objet sur la console :
console. enregistrer ( newObjectArr ) ;La propriété ' nom ' de l'objet dont l'id est ' 9 ' a été remplacé par ' 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 changer 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 affiche la valeur de l'élément s'il satisfait la condition. Sinon, ça donne ' indéfini , ' indiquant qu'aucun élément de ce type n'a été trouvé.
Syntaxe
Utilisez la syntaxe donnée pour la méthode find() pour trouver l'élément dans un tableau :
//condition
} ) ;
Exemple
Appelez la méthode find() pour trouver l'objet dont l'id est ' 5 ' et stocker l'objet dans une variable ' trouverIndex ” :
retour obj. identifiant === 5 ;
} ) ;
Vérifiez si la variable 'findIndex' n'est pas égale à ' indéfini ' signifie, si l'objet est trouvé, changer la valeur de la propriété ' nom ' de l'objet :
si ( trouverIndex !== indéfini ) {trouverIndex. nom = 'John' ;
}
Enfin, imprimez l'objet sur la console :
console. enregistrer ( trouverIndex ) ;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-of'
Vous pouvez également utiliser le ' pour-de ' boucle pour changer 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 en utilisant le ' casser ' mot-clé.
Syntaxe
Suivez la syntaxe donnée pour la boucle 'for-of':
si ( 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 ” :
si ( obj. identifiant === 5 ) {
obj. âge = 27 ;
casser ;
}
}
Imprimez l'objet mis à jour dans le tableau sur la console :
console. enregistrer ( tabObj ) ;Sortir
Nous avons rassemblé toutes les informations essentielles concernant la valeur changeante 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 JavaScript prédéfinies, y compris le ' trouverIndex() , ' carte() 'méthode avec' opérateur de propagation ”, “ trouver() » ou la méthode « pour-de ' boucle. Ces méthodes ont réussi à modifier les valeurs d'un objet dans un tableau. Ce didacticiel 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.