Eviter les mutations

• Array.concat
• Array.splice
• ...spread
• Array.map
• Array.filter
• Object.assign

Eviter les mutations

export const items = (state: any = [], {type, payload}) => {
  switch (type) {
    case 'ADD_ITEMS':
      return payload
    case 'CREATE_ITEM':
      return [...state, payload]
    case 'UPDATE_ITEM':
      return state.map(item => {
        return item.id === payload.id ? Object.assign({}, item, payload) : item
      })
    case 'DELETE_ITEM':
      return state.filter(item => {
        return item.id !== payload.id
      })
    default:
      return state
  }
}

Eviter les mutations

export const items = (state: any = [], {type, payload}) => {
  switch (type) {
    case 'ADD_ITEMS':
      return payload
    case 'CREATE_ITEM':
      return [...state, payload]
    case 'UPDATE_ITEM':
      return state.map(item => {
        return item.id === payload.id ? Object.assign({}, item, payload) : item
      })
    case 'DELETE_ITEM':
      return state.filter(item => {
        return item.id !== payload.id
      })
    default:
      return state
  }
}

Eviter les mutations

export const items = (state: any = [], {type, payload}) => {
  switch (type) {
    case 'ADD_ITEMS':
      return payload
    case 'CREATE_ITEM':
      return [...state, payload]
    case 'UPDATE_ITEM':
      return state.map(item => {
        return item.id === payload.id ? Object.assign({}, item, payload) : item
      })
    case 'DELETE_ITEM':
      return state.filter(item => {
        return item.id !== payload.id
      })
    default:
      return state
  }
}

Les méthodes/lib utiles !

• Object.freeze
• deep-freeze
• eslint-plugin-immutable
• Immutable.js
• Ramda.js

Object.freeze

• Cette méthode freeze un objet !
• Prévient l'ajout de nouvelle propriété, de la suppression et de la modification de celle existante
• Retourne l'objet freeze

deep-freeze

• Un projet pour appliquer un Object.freeze() de façon récursive

eslint-plugin-immutable

• Un plugin ESLint qui permet de désactiver/activer toutes les warning/erreur sur les code assujetis à des mutations

Immutable.js & Ramda.js

• Des librairies qui permettent de facilement mettre en place un écosystème immutable
• ImmutableJS (facebook)
• RamdaJS