Immutable Data Structures

A discussion of immutable data and why we like it.

Transcript

1. Immutable Data Structures Daniel Brook-Roberge, May 30, 2017
2. Mutability and Immutability • A data object is mutable when, through one reference, one can make a change that is visible to all other references. • In contrast, an immutable object is one where this is not possible. • Making a change to an immutable object thus requires crea?ng a new object, with its own set of references.
3. Examples of Mutability and Immutability // Javascript arrays are mutable: const appendFive = (list) => { list.push(5) } const fibs = [1, 1, 2, 3] appendFive(fibs) console.log(fibs) // prints [1, 1, 2, 3, 5] // Javascript numbers are immutable: const addFive = (num) => { num += 5 } const value = 3 addFive(value) console.log(value) // prints 3
4. Immutability and Predictability • Immutable objects are predictable; once your code has a reference to one, it is guaranteed not to change • This makes it much easier to decouple parts of a program; references to mutable objects can expose the internals of one piece of code to another. • This is responsible, for example, for the predictability and debuggability of Redux.
5. Unpredictable Mutability in Ac2on • In early versions of Fortran, integer literals were mutable references: c This prints 6: PRINT *, (5 + 1) c Seriously, this worked at one point: 5 = 7 c This prints 8: PRINT *, (5 + 1) • This allowed one stray statement to change the meaning and correctness of the whole program.
6. Working With Immutable Data Structures • Opera'ons on immutable data structures, rather than changing the structure itself, return new structures containing the new data. • If the en're structure is immutable, this allows efficient copies; parts of the structure that do not change can be references to the same parts in the previous structure.
7. "Immutable" Data with Spread Operators • With the array and object spread operators, we can treat ordinary Javascript objects immutably with straigh;orward syntax: // mutate the array myArray.push(5) // create a new array const myArray2 = [...myArray, 5] // mutate the object myObj.mutated = true // create a new object const myObj2 = { ...myObj, mutated: false }
8. Immutable.JS • Immutable.JS is a library from Facebook that implements a variety of immutable data structures in Javascript, including: • Map • List • Set • These present a different API from the similar plain Javascript objects, but have similar capabiliDes
9. Immutable List Opera0ons // With mutable arrays const array = [] array[0] = 5 array.push(4) console.log(array.shift()) // prints 5 console.log(array.shift()) // prints 4 // With Immutable Lists const list = Immutable.List() const listWith5 = list.set(0, 5) const listWith5And4 = list.push(4) console.log(listWith5And4.first()) // prints 5 console.log(listWith5And4.shift().first()) // prints 4
10. Advantages of Immutable.JS • Immutable.JS ensures that the data it manages is kept immutably • Immutable objects can perform a wide variety of opera>ons efficiently • Immutable allows efficient deep comparison of large data structures
11. but
12. Disadvantages of Immutable.JS • Immutable objects have a different API than plain Javascript objects • Repeated conversions between Immutable and plain objects are inefficient • (though this is why I wrote reselect-immutable- helpers) • Immutable is a bit large in size
13. Summary • Immutable data makes programs more modular and simpler to reason about • While not a first-class construct in Javascript, it is straigh<oward to operate immutably on Javascript data structures • Immutable.JS is a powerful library for efficiently building immutable data structures