Modification des structures stockées dans le localStorage en JavaScript

Supposons qu'un tableau soit stocké dans le stockage local :

let arr = [1, 2, 3, 4, 5];
localStorage.setItem('data', JSON.stringify(arr));

Supposons maintenant que nous ayons besoin de modifier ce tableau d'une certaine manière, par exemple, ajouter un autre élément à sa fin ou modifier un élément existant.

Pour résoudre le problème, récupérons la chaîne représentant le tableau stocké dans le stockage, convertissons cette chaîne en tableau, effectuons les manipulations nécessaires sur ce tableau, reconvertissons ce tableau en chaîne et enregistrons-le à nouveau dans le stockage :

let json = localStorage.getItem('data');
let data = JSON.parse(json);

data.push(6);
data[0] = '!';

localStorage.setItem('data', JSON.stringify(data));

Le tableau suivant d'utilisateurs est donné :

let users = [
	{
		surn: 'surn1',
		name: 'name1',
		age: 31,
	},
	{
		surn: 'surn2',
		name: 'name2',
		age: 32,
	},
	{
		surn: 'surn',
		name: 'name3',
		age: 33,
	},
];

Enregistrez-le dans le stockage local. Ensuite, créez 3 champs de saisie et un bouton. Laissez les champs de saisie recevoir le nom, le prénom et l'âge. Lorsqu'on clique sur le bouton, enregistrez le nouvel utilisateur à la fin du tableau enregistré dans le stockage.