JavaScript

Copies d'objet en JS

Shallow copy ou Deep Copy

2. Deep copie: A l'inverse une copie profonde

Prenon comme object de départ :

const note = {
  title: "Copie en JS",
  date: new Date(),
  writer: ["Romain GABEL"]
}

Shallow copy ??

Une shallow copy d'un objet et une copie dont les propriété partage la même référence.

Spread operator

const shallowCopy = {...note}

Assign méthod

const shallowCopy = Object.assign({}, note)
const shallowCopy = Object.create(note)

Dans les deux cas si nous effectuons une modification sur writer, l'objet note serra impacté

Deep Copy ??

Deep copie: A l'inverse une copie profonde permet de créer une nouvel instance complétement deconnecté du reste.

const copied = structuredClone(note)

copied.writter // ["Romain GABEL"]
copied.date // Date: Wed Dec 31 1969 16:00:00
note.writter === copied.writter // false

structuredClone permet également de copier - Clone indéfiniement les objets et les tableau à l'interieur de l'objet de base. - Clone les références circulaire - Clone une large variété de type Javascript (Date, Set, Map, Error, Blob et autres)

Attention, les foncions ne sont pas copier.

Rethrow JavaScript Error with cause

try {
    connectToDatabase()
} catch (err) {
    throw new Error('Erreur de connexion à la BDD', { cause: errr })
}

07.01.2023

Broadcast Messages

Si vous souhaitez envoyer un message entre tabs / frames / iframes / windows. Vous pouvez utiliser channelApi

// Tab 1: Connexion au channel puis envoyer un message
const bc = new BroadcastChannel('test')
bc.postMessage("My message.")

// Tab 2: Connexion au channel puis afficher les events
const bc = new BroadcastChannel('test')
bc.onmessage = (event) => console.log(event)

07.01.2023