Collections - https://www.youtube.com/watch?v=0fv46hO10Ik

1-array.js

// Array = ordered + indexed + duplicate values
// a.k.a. List

const arr = [1, 2, 3]

// size
arr.length //=> 3

// random-access
arr[1] // 2

// iteration
arr.map((x) => x + 10) //=> 11, 12, 13
arr.forEach()
for (const x of arr) {
  x
}

// mutation
arr[1] = 20 // update any index
arr.unshift() // add at the start
arr.push() // add at the end
arr.shift() // remove from the start
arr.pop() // remove at the end

// conversion
const obj = { foo: 'Foo', bar: 'Bar' }
Object.values(obj) //=> ['Foo', 'Bar']
Object.entries(obj) //=> [ [ 'foo', 'Foo' ], ... ]

2-object.js

// Object = not ordered + key-value pairs + duplicate values
//          keys are strings
// a.k.a. Map, Dictionary, Associative array/collection,
//        Lookup table, Hash (table/map)

const obj = { user: 'foo', email: 'foo@example.org' }

// size
Object.getOwnPropertyNames(obj).length //=> 2

// random-access
obj.user //=> 'foo'
obj['email'] //=> 'foo@example.org'

// iteration
Object.keys(obj) //=> ['user', 'email']
Object.values(obj) //=> ['foo', 'foo@example.org']
Object.entries(obj) //=> [['user', 'foo'], ...]
for (const [key, value] of Object.entries(obj)) {
  key //=> 'user'
  value //=> 'foo'
}

// mutation
obj.user = 'bar' // add/change the value of a property
delete obj.email // delete a key-value pair

// conversion
const arr = ['a', 'b']
Object.fromEntries(arr) //=> { '0': 'a', '1': 'b' }

// example
const sessions = {
  '194dc20': { user: 'foo', email: 'foo@example.org' },
  '5b631ed': { user: 'bar', email: 'bar@example.org' },
}

3-1-set.js

// Set = ordered + unique values

const set = new Set([1, 2, 3])

// size
set.size //=> 3

// access
set.has(2) //=> true

// iteration
set.forEach((x) => {})
for (const x of set) {
  x
}

// mutation
set.add(42) // adds 42
set.add(42) // no-op
set.delete(42)
set.clear()

// conversion
new Set([1, 2, 3])
Array.from(set) //=> [1, 2, 3]
new Set(Object.values({ foo: 'Foo' })) //=> Set { 'Foo' }

3-2-set-operations.js

// examples.js
const setA = new Set([1, 2, 3, 4])
const setB = new Set([2, 3])
const setC = new Set([3, 4, 5, 6])

isSuperset(setA, setB) // returns true
union(setA, setC) // returns Set { 1, 2, 3, 4, 5, 6 }
intersection(setA, setC) // returns Set { 3, 4 }
difference(setA, setB) // returns Set { 1, 4 }

// util/set-operations.js
// source: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set#implementing_basic_set_operations
export function isSuperset(set, subset) {
  for (const elem of subset) {
    if (!set.has(elem)) {
      return false
    }
  }
  return true
}

export function union(setA, setB) {
  const _union = new Set(setA)
  for (const elem of setB) {
    _union.add(elem)
  }
  return _union
}

export function intersection(setA, setB) {
  const _intersection = new Set()
  for (const elem of setB) {
    if (setA.has(elem)) {
      _intersection.add(elem)
    }
  }
  return _intersection
}

export function difference(setA, setB) {
  const _difference = new Set(setA)
  for (const elem of setB) {
    _difference.delete(elem)
  }
  return _difference
}

4-1-map.js

// Map = ordered + key-value pairs

const map = new Map([
  ['foo', 'Foo'],
  ['bar', 'Bar'],
])

// size
map.size //=> 2

// access
map.has('foo') //=> true
map.get('bar') //=> 'Bar'

// iteration
map.keys() //=> ['foo', 'bar']
map.values() //=> ['Foo', 'Bar']
map.entries() //=> [['foo', 'Foo'], ['bar', 'Bar']]
map.forEach(([k, v]) => {})
for (const [key, value] of map) {
}

// mutation
map.set('baz', 'Baz')
map.delete('foo')
map.clear()

// conversion
new Map() // 2d array -> Map
Array.from(map) // Map -> 2d array
new Map(Object.entries(address)) // Object -> Map
Object.fromEntries(map) // Map -> Object

4-2-map-usage.js

const users = new Map()
users.set('foo', { name: 'Foo', email: 'foo@example.org' })
users.set('bran', { name: 'Bran', email: 'bran@example.org' })
users.set('bar', { name: 'Bar', email: 'bar@example.org' })

// random-access:
users.get('bran')

// iterate in order:
for (const [username, user] of users) {
  username
  user
}

4-3-map-usage.js

const users = {
  foo: { name: 'Foo', email: 'foo@example.org' },
  bran: { name: 'Bran', email: 'bran@example.org' },
  bar: { name: 'Bar', email: 'bar@example.org' },
}
const usersAdditional = new WeakMap()
usersAdditional.set(users.bran, { admin: true })

// access object with additional properties:
Object.assign({}, users.bran, usersAdditional.get(users.bran))
//=> { name: 'foo', email: 'bran@example.org', admin: true }

5-1-stack.js

// Stack, natively with Array
const stack = []

stack.push(42) // add at the end
const val1 = stack.pop() // remove from the end
const val2 = stack[stack.length - 1] // peek at the end

5-2-stack-class.js

// Stack, implemented with Array
class Stack {
  constructor(arr) {
    this._stack = arr
  }
  push(val) {
    this._stack.push(val)
  }
  pop() {
    return this._stack.pop() // mutates arr
  }
  peek() {
    return this._stack[this._stack.length - 1]
  }
}

const stack = new Stack()
stack.push(42) // add at the end
stack.push(42) // add at the end
const val1 = stack.pop() // remove from the end
const val2 = stack.peek() // peek at the end

5-3-stack-unique.js

// Stack, implemented with Set
class UniqueStack {
  constructor(arr) {
    this._stack = new Set(arr)
  }
  push(val) {
    this._stack.add(val)
  }
  pop() {
    const arr = Array.from(this._stack)
    const val = arr.pop() // mutates arr
    this._stack = new Set(arr)
    return val
  }
  peek() {
    const arr = Array.from(this._stack)
    const val = arr[arr.length - 1]
    return val
  }
}

const uniqueStack = new UniqueStack()
uniqueStack.push(42) // add at the end
uniqueStack.push(42) // no-op, duplicate
const val3 = uniqueStack.pop() // remove from the end
const val4 = uniqueStack.peek() // peek at the end

6-queue.js

// Queue with Array (front to back)
const queue1 = []
queue1.push(42) // add at the end
const val1 = queue1.shift() // remove from the start

// Queue with Array (back to front)
const queue2 = []
queue2.unshift(42) // add at the start
const val2 = queue2.pop() // remove from the end

// Queue with Set is also possible
// [similar to UniqueStack impl.]

7-deque.js

// Deque with Array
const deque = []
deque.unshift(42) // add at the start
deque.push(42) // add at the end
const val1 = deque.shift() // remove from the start
const val2 = deque.pop() // remove at the end

// Deque with Set is also possible
// [similar to UniqueStack impl.]