cours-420-301-ah/json-gnome-exemple.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 2,
   "id": "979a911a",
   "metadata": {},
   "outputs": [],
   "source": [
    "class Human {\n",
    "\n",
    "    constructor(name, age){\n",
    "        this.name = name;\n",
    "        this.age = age;\n",
    "    }\n",
    "    \n",
    "    toJSON(){\n",
    "        return {\n",
    "            type: \"Human\",\n",
    "            age: this.age,\n",
    "            name: this.name,\n",
    "        }\n",
    "    }\n",
    "}\n",
    "\n",
    "class Gnome{\n",
    "    constructor(name, height){\n",
    "        this.name = name;\n",
    "        this.height = height;\n",
    "    }\n",
    "\n",
    "    toJSON(){\n",
    "        return {\n",
    "            type: \"Gnome\",\n",
    "            name: this.name,\n",
    "            height: this.height,\n",
    "        }\n",
    "    }\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",
    "\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 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": {
  "kernelspec": {
   "display_name": "Deno",
   "language": "typescript",
   "name": "deno"
  },
  "language_info": {
   "file_extension": ".ts",
   "mimetype": "text/x.typescript",
   "name": "typescript",
   "nb_converter": "script",
   "pygments_lexer": "typescript",
   "version": "5.3.3"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}