simple-immuter
TypeScript icon, indicating that this package has built-in type declarations

1.2.3 • Public • Published

Simple Immuter

🚀 Sobre

Simple Observable

by: Immer

Descrição

Desenvolvimento da biblioteca Simple Immuter.

Esse projeto surgiu por meio de uma motivação da biblioteca Immer.
Ao longo das últimas semanas estive estudando a fundo o desenvolvimento de uma função de cloneDeep, capaz de realizar clonagem profunda de objetos e arrays. Tendo como inspiração a função cloneDeep da biblioteca lodash.
Para isso precisei me aprofundar no desenvolvimento de funções recursivas, para me auxiliar em descer os níveis de profundidade dos objetos e mantendo uma fácil interpretação e manutenibilidade das mesmas.

Inspirado na função produce da biblioteca Immer, o Simple Immuter opera de modo semelhante.
A ideia básica é que você aplicará todas as suas alterações a um draftState temporário, que é uma cópia profunda do currentState. Assim que todas as suas mutações forem concluídas, o Simple Immuter produzirá o nextState com base nas mutações do draftState em cima do currentState. Isso significa que você pode interagir com os seus dados simplesmente modificando-os e mantendo todos os benefícios dos dados imutáveis, isto é, o nextState será um cópia profunda e imutável do currentState.

Exemplo 1

Resultado

O baseState não será alterado, mas o nextState será uma nova árvore imutável que reflete todas as alterações feitas no draftState (e compartilhando estruturalmente as coisas que não foram alteradas).

produce

produce(baseState: Object | Array | Map | Set | Promise | [, producer: (draftState) => void][, ...states: object[] | array[]): nextState
  • baseState: Object | Array | Map | Set | Promise
  • producer
    • Object: (opcional) Se baseState for um objeto, draftState deverá ser um objeto. O nextState será o resultado do merge entre draftState e baseState.
    • Array: (opcional) Se baseState for passado array, draftState deverá ser um array. O nextState será o resultado do merge entre draftState e baseState.
    • Map: (opcional) Se baseState for um Map, draftState deverá ser um Map. O nextState será o resultado do merge entre draftState e baseState.
    • Set: (opcional) Se baseState for um Set, draftState deverá ser um Set. O nextState será o resultado do merge entre draftState e baseState.
    • Promise: (opcional) Se baseState for uma Promise, draftState deverá ser do mesmo tipo da Promise. O nextState será uma Promise do resultado do merge entre draftState e baseState.
  • producer: (opcional) Se for passado uma função, currentState pode ser um objeto ou um array. O draftState é um clone do currentState onde será alterado dentro da função producer. O nextState será o resultado do draftState em cima do currentState.
  • states: (opcional) o parâmetro states será tratado internamente como um Array. Podendo ser um Array de Objetos ou um Array de Arrays. Se states for um Array de Arrays, todos os parâmetros de produce serão mergeados e tratados como Array para gerar o Array nextState. Se states for um Array de Objetos, todo os parâmetros de produce serão mergeados e tratados como Objetos para gerar o Objeto nextState.
  • Se o segundo parâmetro de produce for omitido, o nextState será um deepClone de currentState.

Exemplo 2

Utilizando objetos criados a partir de classes e funções construtoras, os prototipos são herdados para os objetos criados a partir do produce.

Clonagem profunda de Array

Clonagem profunda de Objeto

baseState (objeto a ser clonado)

nextState: (objeto clonado)

Observação: Estruturas de dados como Map e Set, possuem métodos para inserção, limpeza e remoção de elementos. Para garantir a imutabilidade do clone resultante, esses métodos são sobrescritos no processo de imutabilidade, que ocorre logo após o merge entre o baseState com o draftState.
Para refletir a remoção, adição ou limpeza dessas estruturas no nextState, é necessário realizá-la dentro da função producer.

Alterando estrutura Map dentro da função producer

O exemplo a seguir demonstra a inserção e remoceção de elementos de dentro da estrutura Map do exemplo anterior

Resultado: Observe que na imagem acima, a instrução de remoção:

nextPeople.hobbies.set('sport', 'footbal')
diretamente no nextPeople foi executada. Entretando, na imagem abaixo, a seta vermelha indica o resultado no terminal, informando que este objeto foi congelado e não deve ser mutado. Ou seja, as mutações devem ocorrer dentro da função producer.

Merge de Arrays

Se os dois parâmetros de produce forem arrays, o nextState será um array imutável resultante do merge de ambos os arrays

Se o parâmetro states for passado e todos os states forem do tipo Array, o nextState será o resultado do merge de todos os Arrays

Merge de Objetos

Se os dois parâmetros de produce forem objetos, o nextState será um objeto imutável resultante do merge de ambos os objetos

Se o parâmetro states for passado e todos os states forem do tipo Object, o nextState será o resultado do merge de todos os Objetos

Compatibilidade com Promises

Compatibilidade com tipo Symbol

A função produce é capaz de copiar as propriedades Symbol do objeto baseState para o nextState.

💻 Tecnologias utilizadas

Package Sidebar

Install

npm i simple-immuter

Weekly Downloads

10

Version

1.2.3

License

MIT

Unpacked Size

60.8 kB

Total Files

16

Last publish

Collaborators

  • cahmoraes93