At work, my team and I decided to migrate from Lodash to Immutable.js. I was tasked to do the migration for one of our older codebases, where Lodash was heavily in use. During the migration, I noticed, that I actually could just use modern JavaScript functions instead.

So I thought I could just write a small article that serves as a cheat sheet for working with lists, maps, sets, and objects without mutating existing data.

Working with Lists

Most of these functions are actually implemented for Iterators, not just lists. But we will be using lists, as it’s the most common use case.

Create a list from a range

Array.from({length:5},(_,i)=> i) //returns [0,1,2,3,4]

Add an element to the front of a list

const list = [0,1,2,3,4]
[42,...list] //returns [42,0,1,2,3,4]

Add an element to the end of a list

const list = [0,1,2,3,4]
[...list,42] //returns [0,1,2,3,4,42]

Remove an element from the start of a list

const list = [0,1,2,3,4]
list.slice(1) //returns [1,2,3,4]

Remove an element from the end of a list

const list = [0,1,2,3,4]
list.slice(0,-1) //returns [0,1,2,3]

Combine two lists

const list1 = [0,1,2,3,4]
const list2 = [0,0,0,0,0]
[...list1,...list2] //returns [0,1,2,3,4,0,0,0,0,0]

Replace an element in a list

const list = [0,1,2,3,4]
[...list.slice(0,2),42,...list.slice(3,-1)]
// returns [0,1,42,3,4]

Map all elements in a list

const list = [1,1,1,1,1]
list.map((value,index) => index*2 + value)
//returns [1,3,5,7,9]

Filter the elements in a list

const list = [0,1,2,1,3]
list.filter((value,index) => value < 2)
//returns [0,1,1]

Working with Maps

The following functions expect that maps are immutable. However, in practice this might not always be useful.

You can check out the documentation on Maps, if you want to use a mutable map instead.

Create a map from a list

const list = [["apple",3],["banana",2]]
new Map(list)

Add an element to a map

const map = new Map([["apple",3],["banana",2]])
new Map([["orange",1],...map])

Remove an element from a map

This solution could be improved

function removeFromMap(key,map){
  const newMap = new Map(map)
  newMap.delete(key)
  return newMap
}

const map = new Map([["apple",3],["banana",2]])
removeFromMap("apple",map)

Create a list from a map

const map = new Map([["apple",3],["banana",2]])
[...map]

Working with Sets

The following functions expect that sets are immutable. However, in practice this might not always be useful.

You can check out the documentation on Sets, if you want to use a mutable map instead.

Create a set from a list

const list = ["apple","banana"]
new Set(list)

Add an element to a set

const set = new Set(["apple","banana"])
new Set(["orange",...set])

Remove an element from a set

This solution could be improved

function removeFromSet(key,set){
  const newSet = new Set(set)
  newSet.delete(key)
  return newSet
}

const set = new Set(["apple","banana"])
removeFromSet("apple",set)

Create a list from a set

const set = new Set(["apple","banana"])
[...set]

Working with Objects

Actual use cases for treating objects as collections are rare. Most of the time, a map might as well do the same job.

Create an object from a list

const list = [["apple",3],["banana",2]]
Object.fromEntries(list)
//returns {apple:3,banana:2}

Add an element to an object

const object = {apple:3,banana:2}
{{orange:1},...object}
//returns {apple:3, banana:2, orange:1}

Remove an element from an object

This solution could be improved

function removeFromObject(key,object){
  const newObject = {...object}
  if(Object.hasOwn(newObject,key)){
    delete newObject[key]
  }
  return newObject
}

const object = {apple:3,banana:2}
removeFromObject("apple",object)
//return {banana:2}

Create a list from an object

const object = {apple:3,banana:2}
Object.entries(object)
//returns [["apple",3],["banana",2]]