From c20bbefcf14b33e3566ecf61360c01563bbf22e6 Mon Sep 17 00:00:00 2001 From: didier amyot Date: Thu, 1 Feb 2024 08:29:13 -0500 Subject: [PATCH] better example --- json-gnome-exemple.ipynb | 190 ++++++++++++++++++++++++++++++++++----- 1 file changed, 170 insertions(+), 20 deletions(-) diff --git a/json-gnome-exemple.ipynb b/json-gnome-exemple.ipynb index faff891..719ba10 100644 --- a/json-gnome-exemple.ipynb +++ b/json-gnome-exemple.ipynb @@ -2,52 +2,202 @@ "cells": [ { "cell_type": "code", - "execution_count": 27, + "execution_count": 2, "id": "979a911a", "metadata": {}, "outputs": [], "source": [ - "class Person {\n", + "class Human {\n", "\n", " constructor(name, age){\n", " this.name = name;\n", " this.age = age;\n", " }\n", " \n", - " isMajor(){\n", - " return this.age > 18;\n", - " }\n", - " \n", " toJSON(){\n", " return {\n", - " type: \"Person\",\n", + " type: \"Human\",\n", " age: this.age,\n", " name: this.name,\n", " }\n", " }\n", - " \n", "}\n", "\n", - "function deserializeObject(object){\n", - " if(object.type === \"Person\"){\n", - " return new Person(object.name, object.age);\n", + "class Gnome{\n", + " constructor(name, height){\n", + " this.name = name;\n", + " this.height = height;\n", " }\n", - " if(object.type === \"Gnome\"){\n", - " return new Gnome(object.name, object.age);\n", + "\n", + " toJSON(){\n", + " return {\n", + " type: \"Gnome\",\n", + " name: this.name,\n", + " height: this.height,\n", + " }\n", " }\n", - " if(object.type === \"Luttin\"){\n", - " return new Luttin(object.name, object.age);\n", + "}\n" + ] + }, + { + "cell_type": "markdown", + "id": "3ec0891a-3c4d-41b0-99d2-80260344274e", + "metadata": {}, + "source": [ + "### Objectif, sérialiser une liste de gnome ou d'human" + ] + }, + { + "cell_type": "code", + "execution_count": 6, + "id": "84f50c8f-5f0a-42fc-ac45-36ddba69d18c", + "metadata": {}, + "outputs": [], + "source": [ + "const persons = [\n", + " new Human(\"Boutros\", 89),\n", + " new Human(\"Fares\", 12),\n", + " new Gnome(\"Petit Pied\", 102),\n", + " new Gnome(\"Grand Gaillard\", 135),\n", + "]\n", + "\n", + "\n", + "function serializePersons(persons){\n", + " const personObjets = persons.map(person => person.toJSON())\n", + " localStorage.setItem(\"persons.json\", JSON.stringify(personObjets));\n", + "}\n", + "\n", + "serializePersons(persons)" + ] + }, + { + "cell_type": "markdown", + "id": "2b05a60d-974c-4e91-b9fb-c17e042445cd", + "metadata": {}, + "source": [ + "### Le statue de local storage est donc..." + ] + }, + { + "cell_type": "code", + "execution_count": 7, + "id": "4c46686d-9099-48f0-bcd0-1703eb385ade", + "metadata": { + "scrolled": true + }, + "outputs": [ + { + "name": "stdout", + "output_type": "stream", + "text": [ + "[{\"type\":\"Human\",\"age\":89,\"name\":\"Boutros\"},{\"type\":\"Human\",\"age\":12,\"name\":\"Fares\"},{\"type\":\"Gnome\",\"name\":\"Petit Pied\",\"height\":102},{\"type\":\"Gnome\",\"name\":\"Grand Gaillard\",\"height\":135}]\n" + ] + } + ], + "source": [ + "console.log(localStorage.getItem(\"persons.json\"))" + ] + }, + { + "cell_type": "markdown", + "id": "dd8acf55-c0f6-4638-905e-12e8c80c8bbd", + "metadata": {}, + "source": [ + "### Plus bas, il s'agit de la logique pour deserialiser les personnes" + ] + }, + { + "cell_type": "code", + "execution_count": 22, + "id": "ef98a65f-8156-4f27-943c-d17b63111838", + "metadata": {}, + "outputs": [], + "source": [ + "function deserializeHumanObject(humanObject){\n", + " return new Human(humanObject.name, humanObject.age)\n", + "}\n", + "\n", + "function deserializeGnomeObject(gnomeObject){\n", + " return new Gnome(gnomeObject.name, gnomeObject.height)\n", + "}\n", + "\n", + "function deserializePersonObject(person){\n", + " if(person.type === \"Human\"){\n", + " return deserializeHumanObject(person);\n", + " }\n", + " if(person.type === \"Gnome\"){\n", + " return deserializeGnomeObject(person);\n", " }\n", "}\n", "\n", - "function deserializeArray(lst){\n", - " const ret = [];\n", - " for(const e of lst){\n", - " ret.push(deserializeObject(e));\n", + "\n", + "function deserializePersons(){\n", + " const personObjects = JSON.parse(localStorage.getItem(\"persons.json\"));\n", + " if(!personObjects){\n", + " return []; // le cas ou il n'y a rien de sauvegarder dans \"persons.json\"\n", " }\n", - " return ret;\n", + " return personObjects.map(deserializePersonObject)\n", "}" ] + }, + { + "cell_type": "markdown", + "id": "b325ab23-811f-489e-a974-13f64a1ce9e0", + "metadata": {}, + "source": [ + "### Plus bas, voici comment deserialiser toutes les personnes du localstorage" + ] + }, + { + "cell_type": "code", + "execution_count": 20, + "id": "690b3db8-ad1d-433b-82dc-58afe4c97927", + "metadata": {}, + "outputs": [ + { + "data": { + "text/plain": [ + "[]" + ] + }, + "execution_count": 20, + "metadata": {}, + "output_type": "execute_result" + } + ], + "source": [ + "deserializePersons()" + ] + }, + { + "cell_type": "markdown", + "id": "6ca1e818-7bf9-4641-a219-db4a4ae56b79", + "metadata": {}, + "source": [ + "Cas special: deserializer un constenue de localstorage vide" + ] + }, + { + "cell_type": "code", + "execution_count": 21, + "id": "4fcdaa7e-0d7c-4bbb-8a70-ffb6586387fd", + "metadata": {}, + "outputs": [ + { + "data": { + "text/plain": [ + "[]" + ] + }, + "execution_count": 21, + "metadata": {}, + "output_type": "execute_result" + } + ], + "source": [ + "localStorage.clear() // efface tout du localstorage. Le cas du premier visiteur\n", + "deserializePersons()" + ] } ], "metadata": {