JavaScript: Array, 1–40

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19const literal = [1, 2, 3];
const listed = Array.of(1, 2, 3);
const mapped = Array.from('123', Number);              // a string is iterable
const spread = [...new Set([1, 2, 3, 3])];             // any iterable will do
const counted = Array.from({ length: 3 }, (_, i) => i + 1);

// The single-argument constructor is the trap. One number means a length.
const sized = Array(3);
const single = Array.of(3);

console.log('literal :', literal);
console.log('of      :', listed);
console.log('from    :', mapped);
console.log('spread  :', spread);
console.log('counted :', counted);
console.log('--- Array(3) against Array.of(3) ---');
console.log('Array(3)    :', sized, 'length', sized.length);
console.log('Array.of(3) :', single, 'length', single.length);
console.log('is index 0 present in Array(3)?', 0 in sized, '<- a hole, not a value');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18const zeros = new Array(4).fill(0);
const partial = [1, 2, 3, 4, 5].fill(0, 1, 3);         // indexes 1 and 2 only
const tail = [1, 2, 3, 4].fill(0, -2);                 // the last two

// One array object, referenced three times.
const shared = new Array(3).fill([]);
shared[0].push('x');

// A factory runs once per slot, so each slot gets its own array.
const separate = Array.from({ length: 3 }, () => []);
separate[0].push('x');

console.log('zeros   :', zeros);
console.log('partial :', partial, '<- fill(0, 1, 3) covers 1 and 2, not 3');
console.log('tail    :', tail);
console.log('--- one array, or three? ---');
console.log('fill([])       :', shared, '<- pushing into row 0 changed all three');
console.log('Array.from(...) :', separate);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17function range(start, end, step = 1) {
  if (step === 0) throw new RangeError('step must not be 0');
  const count = Math.max(0, Math.ceil((end - start) / step));
  return Array.from({ length: count }, (_, i) => start + i * step);
}

const refused = (() => {
  try { range(1, 5, 0); return 'no error'; } catch (e) { return e.constructor.name; }
})();

console.log('range(1, 5)      :', range(1, 5));
console.log('range(0, 10, 2)  :', range(0, 10, 2));
console.log('range(5, 1, -1)  :', range(5, 1, -1));
console.log('range(3, 3)      :', range(3, 3), '<- end is excluded, so nothing');
console.log('range(1, -5)     :', range(1, -5), '<- wrong direction for a +1 step');
console.log('step of 0        :', refused);
console.log('the shortcut for range(0, n):', [...Array(5).keys()]);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21const chars = Array.from('Lagos');
const unique = Array.from(new Set([1, 1, 2, 3]));
const pairs = Array.from(new Map([['a', 1], ['b', 2]]));
const arrayLike = Array.from({ length: 3, 0: 'a', 1: 'b', 2: 'c' });

// The array-like has a length but no Symbol.iterator, so spread refuses it.
const spreadArrayLike = (() => {
  try { return [...{ length: 2, 0: 'a', 1: 'b' }]; } catch (e) { return e.constructor.name; }
})();

const withEmoji = 'a😀b';                       // three code points, four units

console.log('string     :', chars);
console.log('Set        :', unique);
console.log('Map        :', pairs);
console.log('array-like :', arrayLike);
console.log('spreading the array-like:', spreadArrayLike);
console.log('--- a string is not a row of characters ---');
console.log('Array.from :', Array.from(withEmoji), Array.from(withEmoji).length);
console.log('.length    :', withEmoji.length);
console.log("split('')  :", withEmoji.split('').length, '<- the emoji came apart');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19const grid = (rows, cols, value = 0) =>
  Array.from({ length: rows }, () => Array.from({ length: cols }, () => value));

const good = grid(2, 2);
good[0][0] = 9;

// One inner array, referenced by every row.
const shared = new Array(2).fill(new Array(2).fill(0));
shared[0][0] = 9;

// Indexes are available if the mapper wants them: row, then column.
const coords = Array.from({ length: 2 }, (_, r) =>
  Array.from({ length: 3 }, (_, c) => r * 3 + c));

console.log('good   :', good, '<- one cell changed');
console.log('shared :', shared, '<- both rows changed');
console.log('same object?', shared[0] === shared[1]);
console.log('coords :', coords);
console.log('reading a cell:', coords[1][2], ' out of range:', coords[9]?.[0]);

1
2
3
4
5
6
7
8
9
10
11const stops = ['Yaba', 'Surulere', 'Mushin', 'Oshodi'];

const first = (xs) => xs.at(0);
const last = (xs) => xs.at(-1);

console.log('first     :', first(stops));
console.log('last      :', last(stops));
console.log('at(-2)    :', stops.at(-2));
console.log('stops[-1] :', stops[-1], '<- a property named "-1", which does not exist');
console.log('the old way:', stops[stops.length - 1]);
console.log('out of range:', stops.at(99), ' on an empty array:', [].at(0));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16function pick(xs, i, fallback = null) {
  if (!Array.isArray(xs)) return fallback;
  const value = xs.at(i);                    // handles negative indexes for us
  return value === undefined ? fallback : value;
}

const xs = ['a', 'b', 'c'];

console.log('in range      :', pick(xs, 1));
console.log('out of range  :', pick(xs, 9, '?'));
console.log('from the end  :', pick(xs, -1));
console.log('not an array  :', pick(null, 0, 'none'));
console.log('--- a falsy element must not trigger the fallback ---');
console.log('pick([0], 0, 99)  :', pick([0], 0, 99), '<- 0 is a real value');
console.log("pick([''], 0, 'x'):", JSON.stringify(pick([''], 0, 'x')));
console.log('the one-liner     :', xs?.[9] ?? '?');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25const cut = [1, 2, 3, 4, 5];
cut.length = 3;                          // the last two are gone for good

const grown = [1, 2];
grown.length = 4;                        // two holes appended

// Emptying in place, which every reference sees. Reassigning to [] does not.
const original = [1, 2, 3];
const alsoOriginal = original;
original.length = 0;

// A sparse array from a far-off index.
const sparse = [];
sparse[9] = 'x';

const badLength = (() => {
  try { const a = [1]; a.length = -1; return 'accepted'; } catch (e) { return e.constructor.name; }
})();

console.log('truncated :', cut);
console.log('grown     :', grown, 'length', grown.length);
console.log('is index 3 present?', 3 in grown, '<- a hole');
console.log('emptied in place:', original, 'and the other reference:', alsoOriginal);
console.log('sparse    : length', sparse.length, 'but real keys', Object.keys(sparse));
console.log('length = -1:', badLength);

1
2
3
4
5
6
7
8
9
10
11const readings = [10, 20, 30, 20, NaN];

console.log('indexOf(20)      :', readings.indexOf(20));
console.log('lastIndexOf(20)  :', readings.lastIndexOf(20));
console.log('indexOf(99)      :', readings.indexOf(99), '<- the miss value is -1');
console.log('includes(30)     :', readings.includes(30));
console.log('--- NaN is where the two part company ---');
console.log('indexOf(NaN)     :', readings.indexOf(NaN), '<- === says NaN !== NaN');
console.log('includes(NaN)    :', readings.includes(NaN), '<- SameValueZero says it is');
console.log('findIndex is the other way to locate a NaN:', readings.findIndex(Number.isNaN));
console.log("indexOf('20')    :", readings.indexOf('20'), '<- no coercion');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20const fares = [
  { route: 'Yaba', price: 450 },
  { route: 'Ikeja', price: 900 },
  { route: 'Ojota', price: 450 },
];

let findCalls = 0;
const firstDear = fares.find((f) => { findCalls++; return f.price > 500; });

let filterCalls = 0;
const allCheap = fares.filter((f) => { filterCalls++; return f.price === 450; });

console.log('find      :', firstDear);
console.log('findIndex :', fares.findIndex((f) => f.price > 500));
console.log('filter    :', allCheap.map((f) => f.route));
console.log('--- the miss values are all different ---');
console.log('find    misses ->', fares.find((f) => f.price > 1e6));
console.log('findIndex misses ->', fares.findIndex((f) => f.price > 1e6));
console.log('filter  misses ->', fares.filter((f) => f.price > 1e6));
console.log('predicate calls: find', findCalls, 'of 3, filter', filterCalls, 'of 3');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20const readings = [3, 8, 2, 9, 4];

let lastCalls = 0;
const lastFour = readings.findLast((n) => { lastCalls++; return n === 4; });

let firstCalls = 0;
const firstFour = readings.find((n) => { firstCalls++; return n === 4; });

// The pre-findLast idiom, and the index bug that comes with it.
const reversed = [...readings].reverse();
const reversedIndex = reversed.findIndex((n) => n > 5);

console.log('findLast(n > 5)      :', readings.findLast((n) => n > 5));
console.log('findLastIndex(n > 5) :', readings.findLastIndex((n) => n > 5));
console.log('find(n > 5)          :', readings.find((n) => n > 5), '<- the first one instead');
console.log('--- the reversed-copy workaround ---');
console.log('index in the reversed copy:', reversedIndex);
console.log('converted back            :', readings.length - 1 - reversedIndex);
console.log('predicate calls: findLast', lastCalls, ' find', firstCalls);
console.log('both found the same value:', lastFour === firstFour);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15const temps = [21, 24, 19];

let someCalls = 0;
const anyHot = temps.some((t) => { someCalls++; return t > 23; });

let everyCalls = 0;
const allWarm = temps.every((t) => { everyCalls++; return t > 22; });

console.log('some(t > 23) :', anyHot, ' after', someCalls, 'of 3 calls');
console.log('every(t > 22):', allWarm, ' after', everyCalls, 'of 3 calls');
console.log('every(t > 18):', temps.every((t) => t > 18));
console.log('--- the empty array ---');
console.log('[].some(...)  :', [].some(() => true));
console.log('[].every(...) :', [].every(() => false), '<- true, with a predicate that is never true');
console.log('every is "no counter-example exists", and an empty list has none');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15const doubled = [1, 2, 3].map((n) => n * 2);
const labelled = ['a', 'b'].map((v, i) => `${i}:${v}`);

// parseInt(value, index): the index arrives as the radix.
const broken = ['1', '7', '11'].map(parseInt);
const fixed = ['1', '7', '11'].map(Number);

console.log('doubled :', doubled);
console.log('labelled:', labelled);
console.log('--- map(parseInt) hands the index over as the radix ---');
console.log('map(parseInt) :', broken);
console.log("parseInt('1', 0)  ->", parseInt('1', 0), ' radix 0 means "guess", so decimal');
console.log("parseInt('7', 1)  ->", parseInt('7', 1), ' radix 1 does not exist');
console.log("parseInt('11', 2) ->", parseInt('11', 2), ' binary 11 is 3');
console.log('map(Number)   :', fixed);

1
2
3
4
5
6
7
8
9
10
11
12
13const mixed = [0, 1, '', null, 'a', undefined, NaN, 2, false];

const truthy = mixed.filter(Boolean);
const present = mixed.filter((v) => v != null);      // loose !=, so null AND undefined

console.log('input   :', mixed);
console.log('truthy  :', truthy);
console.log('present :', present, '<- keeps 0, "" and NaN');
console.log('--- things that look empty but are truthy ---');
console.log("['0']      ->", ['0'].filter(Boolean), 'a non-empty string');
console.log('[[]]       ->', [[]].filter(Boolean), 'an empty array is an object');
console.log("['false']  ->", ['false'].filter(Boolean), 'text, not a boolean');
console.log('[{}]       ->', [{}].filter(Boolean).length, 'an empty object too');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15const source = [1, 2, 3, 4, 5];
const sliced = source.slice(1, 3);

const spliceTarget = [1, 2, 3, 4, 5];
const removed = spliceTarget.splice(1, 2);          // returns what it removed

const inserted = [1, 2, 3];
const nothingRemoved = inserted.splice(1, 0, 'x', 'y');   // insert only

console.log('slice(1, 3)      :', sliced, ' source still:', source);
console.log('splice(1, 2)     :', removed, '<- the REMOVED elements');
console.log('the array after  :', spliceTarget);
console.log("splice(1, 0, 'x', 'y'):", nothingRemoved, '<- nothing removed');
console.log('the array after  :', inserted);
console.log('slice(-2)        :', source.slice(-2));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16const insertAt = (xs, i, ...values) => [...xs.slice(0, i), ...values, ...xs.slice(i)];
const removeAt = (xs, i, count = 1) => [...xs.slice(0, i), ...xs.slice(i + count)];
const replaceAt = (xs, i, value) => xs.map((v, k) => (k === i ? value : v));

const stops = ['Yaba', 'Mushin', 'Oshodi'];

// The built-in copying replace, where the engine has it.
const hasWith = typeof Array.prototype.with === 'function';
const builtIn = hasWith ? [1, 2, 3].with(1, 'x') : [1, 'x', 3];

console.log('insert  :', insertAt(stops, 1, 'Surulere'));
console.log('remove  :', removeAt(stops, 1));
console.log('replace :', replaceAt(stops, 0, 'Ebute Metta'));
console.log('original:', stops, '<- untouched by all three');
console.log('insert past the end appends:', insertAt(stops, 99, 'Ikeja'));
console.log('with() available here?', hasWith, '->', builtIn);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20const a = [1, 2];
const b = [3, 4];

const joined = a.concat(b);
const spread = [...a, ...b];

const pushedSpread = [1];
pushedSpread.push(...b);            // appends 3 and 4

const pushedWhole = [1];
const newLength = pushedWhole.push(b);   // appends ONE element: the array

console.log('concat      :', joined);
console.log('spread      :', spread);
console.log('inputs after:', a, b, '<- both untouched');
console.log('push(...b)  :', pushedSpread);
console.log('push(b)     :', pushedWhole, '<- one nested element');
console.log('push returned', newLength, 'which is a length, not an array');
console.log('concat with loose values:', a.concat(3, [4, 5]));
console.log('one level only         :', [1].concat([[2]]));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16const nested = [1, [2, [3, [4]]]];

const words = ['the lagos bus', 'is late'];
const allWords = words.flatMap((line) => line.split(' '));

// Returning [] drops an element; returning several expands it.
const oddsOnly = [1, 2, 3, 4].flatMap((n) => (n % 2 ? [n] : []));
const doubledUp = [1, 2].flatMap((n) => [n, n * 10]);

console.log('flat()        :', nested.flat());
console.log('flat(2)       :', nested.flat(2));
console.log('flat(Infinity):', nested.flat(Infinity));
console.log('holes go too  :', [1, , 3].flat(), '<- the middle slot was a hole');
console.log('words         :', allWords);
console.log('odds only     :', oddsOnly);
console.log('doubled up    :', doubledUp);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17const original = [1, 2, 3];
const backwards = original.reverse();      // same array, now reversed

const safe = [1, 2, 3];
const safeCopy = [...safe].reverse();

const hasToReversed = typeof Array.prototype.toReversed === 'function';
const builtIn = hasToReversed ? [1, 2, 3].toReversed() : [3, 2, 1];

console.log('backwards :', backwards);
console.log('original  :', original, '<- reversed as well, because it is the same array');
console.log('same object?', backwards === original);
console.log('--- with a copy ---');
console.log('safeCopy  :', safeCopy);
console.log('safe      :', safe, '<- untouched');
console.log('toReversed available?', hasToReversed, '->', builtIn);
console.log('reversing text needs an array first:', [...'Lagos'].reverse().join(''));

1
2
3
4
5
6
7
8
9
10
11
12
13const stops = ['Yaba', 'Mushin', 'Oshodi'];
const awkward = [1, null, 2, undefined, 3];
const nested = [1, [2, 3], 4];

console.log("join('-')      :", stops.join('-'));
console.log('join()         :', stops.join());
console.log('toString()     :', stops.toString(), '<- the same as join()');
console.log('--- values that vanish ---');
console.log("null/undefined :", awkward.join('-'), '<- two empty gaps');
console.log('a hole too     :', [1, , 3].join('-'));
console.log('--- nesting ---');
console.log('nested         :', nested.join('-'), '<- the inner array used a comma');
console.log('splitting back :', nested.join('-').split('-'));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24function chunk(xs, size) {
  if (!Number.isInteger(size) || size < 1) throw new RangeError('size must be a positive integer');
  const rows = [];
  for (let i = 0; i < xs.length; i += size) rows.push(xs.slice(i, i + size));
  return rows;
}

// The same thing without a loop: work out the row count, then build it.
const chunkFrom = (xs, size) =>
  Array.from({ length: Math.ceil(xs.length / size) }, (_, i) => xs.slice(i * size, i * size + size));

const record = { id: 1 };
const rowsOfObjects = chunk([record], 1);

const refused = (() => {
  try { chunk([1, 2], 0); return 'no error'; } catch (e) { return e.constructor.name; }
})();

console.log('exact fit    :', chunk([1, 2, 3, 4], 2));
console.log('a remainder  :', chunk([1, 2, 3, 4, 5], 2), '<- short last row');
console.log('size > length:', chunk([1, 2], 9));
console.log('empty        :', chunk([], 3));
console.log('size of 0    :', refused);
console.log('flat() undoes it:', chunk([1, 2, 3, 4, 5], 2).flat());

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20const zip = (as, bs) =>
  Array.from({ length: Math.min(as.length, bs.length) }, (_, i) => [as[i], bs[i]]);

// The other reasonable answer: keep every element and pad the gaps.
const zipPad = (as, bs, pad = null) =>
  Array.from({ length: Math.max(as.length, bs.length) }, (_, i) => [
    i < as.length ? as[i] : pad,
    i < bs.length ? bs[i] : pad,
  ]);

const unzip = (pairs) => [pairs.map((p) => p[0]), pairs.map((p) => p[1])];

const keys = ['route', 'price'];
const values = ['Yaba', 450];

console.log('zip        :', zip([1, 2], ['a', 'b']));
console.log('uneven     :', zip([1, 2, 3], ['a']), '<- truncated to the shorter one');
console.log('padded     :', zipPad([1, 2, 3], ['a']));
console.log('unzip      :', unzip([[1, 'a'], [2, 'b']]));
console.log('as an object:', Object.fromEntries(zip(keys, values)));

1
2
3
4
5
6
7
8
9
10
11
12const transpose = (rows) =>
  rows.length === 0 ? [] : rows[0].map((_, c) => rows.map((row) => row[c]));

const grid = [[1, 2, 3], [4, 5, 6]];
const ragged = transpose([[1, 2], [3]]);

console.log('input      :', grid, `${grid.length}x${grid[0].length}`);
console.log('transposed :', transpose(grid), `${transpose(grid).length}x${transpose(grid)[0].length}`);
console.log('twice      :', transpose(transpose(grid)), '<- back to the start');
console.log('one row    :', transpose([[1, 2]]));
console.log('empty      :', transpose([]));
console.log('ragged     :', ragged, '<- the missing cell reads as undefined');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17function rotate(xs, k) {
  const n = xs.length;
  if (n === 0) return [];
  const shift = ((k % n) + n) % n;         // normalise: large k, negative k, both
  return [...xs.slice(shift), ...xs.slice(0, shift)];
}

const xs = [1, 2, 3, 4, 5];

console.log('left by 2  :', rotate(xs, 2));
console.log('left by 0  :', rotate(xs, 0));
console.log('right by 1 :', rotate(xs, -1), '<- a negative k goes the other way');
console.log('by 7 on 5  :', rotate(xs, 7), 'same as by 2');
console.log('--- why the double modulo ---');
console.log('-1 % 5           =', -1 % 5, '<- still negative, so slice would read from the end');
console.log('((-1 % 5) + 5) % 5 =', ((-1 % 5) + 5) % 5);
console.log('input afterwards :', xs);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17const nums = [10, 9, 1, 100, 20];

const asText = [...nums].sort();                   // the default: string order
const asNumbers = [...nums].sort((a, b) => a - b);

// What sort does to the array it is called on.
const victim = [3, 1, 2];
const returned = victim.sort((a, b) => a - b);

console.log('input        :', nums);
console.log('sort()       :', asText, '<- string order');
console.log('sort((a,b)=>a-b):', asNumbers);
console.log('why: as strings,', ['10', '9', '1', '100', '20'].sort());
console.log('--- and it mutates ---');
console.log('victim after sorting:', victim);
console.log('the return value is the same array:', returned === victim);
console.log('the classic:', [10, 9, 1].sort(), '<- 1, 10, 9');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15const asc = (a, b) => a - b;
const desc = (a, b) => b - a;
const byLength = (a, b) => a.length - b.length;
const byText = (a, b) => (a < b ? -1 : a > b ? 1 : 0);

console.log('ascending  :', [10, 9, 1].sort(asc));
console.log('descending :', [10, 9, 1].sort(desc));
console.log('by length  :', ['ccc', 'a', 'bb'].sort(byLength));
console.log('--- only the sign matters ---');
console.log('Math.sign version:', [3, 1, 2].sort((a, b) => Math.sign(a - b)));
console.log('-99 and 99 work as well as -1 and 1:', [3, 1, 2].sort((a, b) => (a < b ? -99 : a > b ? 99 : 0)));
console.log('--- the boolean mistake ---');
console.log('1 > 2 is', 1 > 2, 'which as a number is', Number(1 > 2));
console.log('2 > 1 is', 2 > 1, 'which is', Number(2 > 1), '<- never negative, so nothing moves left');
console.log("'b' - 'a' is", 'b' - 'a', '<- so a - b cannot sort text');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29const staff = [
  { name: 'Ada', dept: 'ops', age: 34 },
  { name: 'Bola', dept: 'eng', age: 29 },
  { name: 'Chi', dept: 'ops', age: 29 },
  { name: 'Dami', dept: 'eng', age: 34 },
];

const byAge = (a, b) => a.age - b.age;
const byKey = (key) => (a, b) => (a[key] < b[key] ? -1 : a[key] > b[key] ? 1 : 0);

// Try each comparator until one has an opinion.
const thenBy = (...comparators) => (a, b) => {
  for (const cmp of comparators) {
    const verdict = cmp(a, b);
    if (verdict !== 0) return verdict;
  }
  return 0;
};

const names = (list) => list.map((s) => s.name);
const sortedByAge = [...staff].sort(byAge);
const twoKeys = [...staff].sort(thenBy(byKey('dept'), byKey('name')));
const twoPasses = [...staff].sort(byKey('name')).sort(byKey('dept'));

console.log('by age            :', names(sortedByAge));
console.log('dept then name    :', names(twoKeys));
console.log('name, then re-sorted by dept:', names(twoPasses), '<- stability makes these agree');
console.log('by age descending :', names([...staff].sort((a, b) => b.age - a.age)));
console.log('original order    :', names(staff));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17const mixedCase = ['apple', 'Banana', 'cherry'];
const numbered = ['item10', 'item9', 'item2'];
const accented = ['zebra', 'éclair'];

const caseInsensitive = (a, b) => a.toLowerCase().localeCompare(b.toLowerCase());
const natural = (a, b) => a.localeCompare(b, undefined, { numeric: true });

console.log('default    :', [...mixedCase].sort(), '<- B before a, by code point');
console.log('locale     :', [...mixedCase].sort((a, b) => a.localeCompare(b)));
console.log('lower-cased:', [...mixedCase].sort(caseInsensitive));
console.log('--- numbers inside text ---');
console.log('default    :', [...numbered].sort(), '<- item10 before item2');
console.log('numeric    :', [...numbered].sort(natural));
console.log('--- accents ---');
console.log('default    :', [...accented].sort(), '<- é is code point 233, past z');
console.log('locale     :', [...accented].sort((a, b) => a.localeCompare(b)));
console.log("'a'.localeCompare('B') =", 'a'.localeCompare('B'));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20const hasCopying = ['toSorted', 'toReversed', 'toSpliced', 'with']
  .every((m) => typeof Array.prototype[m] === 'function');

// Each wrapper uses the built-in where it exists and the old idiom otherwise,
// so the checks below are honest on any engine.
const sortedCopy = (xs, cmp) => (hasCopying ? xs.toSorted(cmp) : [...xs].sort(cmp));
const reversedCopy = (xs) => (hasCopying ? xs.toReversed() : [...xs].reverse());
const splicedCopy = (xs, start, count) =>
  hasCopying ? xs.toSpliced(start, count) : [...xs.slice(0, start), ...xs.slice(start + count)];
const withCopy = (xs, i, v) =>
  hasCopying ? xs.with(i, v) : xs.map((old, k) => (k === i ? v : old));

const nums = [3, 1, 2];

console.log('this engine has the copying methods:', hasCopying);
console.log('toSorted   :', sortedCopy(nums, (a, b) => a - b), ' original:', nums);
console.log('toReversed :', reversedCopy(nums), ' original:', nums);
console.log('toSpliced  :', splicedCopy([1, 2, 3, 4], 1, 2), '<- removed indexes 1 and 2');
console.log('with       :', withCopy(nums, 0, 'x'), ' original:', nums);
console.log('no comparator still means string order:', sortedCopy([10, 9, 1]));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18const sum = (xs) => xs.reduce((total, n) => total + n, 0);
const product = (xs) => xs.reduce((total, n) => total * n, 1);

const emptyNoSeed = (() => {
  try { return [].reduce((a, b) => a + b); } catch (e) { return e.constructor.name; }
})();

// With one element and no initial value, the callback never runs at all.
let calls = 0;
const lone = [5].reduce((a, b) => { calls++; return a + b; });

console.log('sum([1,2,3,4])   :', sum([1, 2, 3, 4]));
console.log('product([2,3,4]) :', product([2, 3, 4]));
console.log('sum([])          :', sum([]), '<- the initial value');
console.log('[].reduce with no initial value:', emptyNoSeed);
console.log('[5].reduce with no initial value:', lone, 'after', calls, 'calls');
console.log('a wrong seed shows up at once: product with 0 ->', [2, 3, 4].reduce((t, n) => t * n, 0));
console.log('floats do not add up exactly:', [0.1, 0.2].reduce((t, n) => t + n, 0));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26const largest = (xs) => xs.reduce((best, n) => (n > best ? n : best), -Infinity);
const smallest = (xs) => xs.reduce((best, n) => (n < best ? n : best), Infinity);

// Pick the record with the smallest price, not just the price itself.
const cheapest = (rows) => rows.reduce((best, r) => (r.price < best.price ? r : best));

const fares = [
  { route: 'Yaba', price: 450 },
  { route: 'Ikeja', price: 900 },
  { route: 'Ojota', price: 300 },
];

const big = Array.from({ length: 200000 }, (_, i) => i);
const spreadBig = (() => {
  try { return String(Math.max(...big)); } catch (e) { return e.constructor.name; }
})();

console.log('reduce  :', largest([3, 9, 4]), smallest([3, 9, 4]));
console.log('Math.max:', Math.max(...[3, 9, 4]), Math.min(...[3, 9, 4]));
console.log('Math.max() with no arguments:', Math.max(), '<- the identity for a maximum');
console.log('--- where they differ ---');
console.log('Math.max(1, NaN, 3) :', Math.max(1, NaN, 3), '<- one bad value poisons it');
console.log('largest([1, NaN, 3]):', largest([1, NaN, 3]), '<- the comparison skips it');
console.log('cheapest record      :', cheapest(fares).route);
console.log('200,000 values through spread:', spreadBig);
console.log('the same through reduce      :', largest(big));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28const rows = [
  { id: 1, name: 'Ada' },
  { id: 2, name: 'Bola' },
  { id: 3, name: 'Chi' },
];

const indexById = (list) => list.reduce((acc, row) => {
  acc[row.id] = row;
  return acc;                                  // forget this line and the next call gets undefined
}, {});

const viaEntries = Object.fromEntries(rows.map((r) => [r.id, r]));
const asMap = new Map(rows.map((r) => [r.id, r]));

const forgotten = (() => {
  try {
    return rows.reduce((acc, row) => { acc[row.id] = row; }, {});
  } catch (e) { return e.constructor.name; }
})();

const keyed = indexById(rows);

console.log('lookup by id   :', keyed[2].name);
console.log('the keys       :', Object.keys(keyed), '<- strings, though the ids were numbers');
console.log('via fromEntries:', Object.keys(viaEntries));
console.log('a Map instead  :', asMap.get(2).name, ' size', asMap.size);
console.log('forgetting the return:', forgotten);
console.log('a duplicate id overwrites:', Object.keys(indexById([...rows, { id: 1, name: 'Late' }])));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32const staff = [
  { name: 'Ada', dept: 'ops', age: 34 },
  { name: 'Bola', dept: 'eng', age: 29 },
  { name: 'Chi', dept: 'ops', age: 29 },
  { name: 'Dami', dept: 'eng', age: 34 },
];

const groupBy = (xs, keyOf) => xs.reduce((acc, x) => {
  (acc[keyOf(x)] ??= []).push(x);               // create the bucket on first sight
  return acc;
}, {});

const groupByMap = (xs, keyOf) => xs.reduce((acc, x) => {
  const key = keyOf(x);
  acc.set(key, [...(acc.get(key) ?? []), x]);
  return acc;
}, new Map());

const names = (list) => list.map((s) => s.name);
const byDept = groupBy(staff, (s) => s.dept);
const byAge = groupByMap(staff, (s) => s.age);

// The built-in, where the engine has it.
const hasGroupBy = typeof Object.groupBy === 'function';
const builtIn = hasGroupBy ? Object.groupBy(staff, (s) => s.dept) : byDept;

console.log('groups     :', Object.keys(byDept), '<- insertion order');
console.log('ops        :', names(byDept.ops));
console.log('eng        :', names(byDept.eng));
console.log('by age, Map:', [...byAge.keys()], '<- still numbers');
console.log('by age, object keys:', Object.keys(groupBy(staff, (s) => s.age)), '<- strings, and reordered');
console.log('Object.groupBy available?', hasGroupBy);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18const countMap = (xs) => xs.reduce((m, v) => m.set(v, (m.get(v) ?? 0) + 1), new Map());
const countObject = (xs) => xs.reduce((o, v) => { o[v] = (o[v] ?? 0) + 1; return o; }, {});

const votes = ['bus', 'keke', 'bus', 'okada', 'bus'];
const mixedTypes = [1, '1', 1];
const notNumbers = [NaN, NaN, undefined];

const a = {};
const b = {};

console.log('votes      :', [...countMap(votes)]);
console.log('as an object:', countObject(votes));
console.log('--- what the object cannot do ---');
console.log("[1, '1', 1] object:", countObject(mixedTypes), '<- one bucket');
console.log("[1, '1', 1] Map   :", [...countMap(mixedTypes)], '<- two');
console.log('NaN as a Map key  :', countMap(notNumbers).get(NaN));
console.log('two empty objects :', countMap([a, b]).size, 'buckets, because keys are identities');
console.log('the same object twice:', countMap([a, a]).get(a));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25const letters = ['a', 'b', 'c'];
const nums = [10, 3, 2];

const visitedRight = [];
letters.reduceRight((acc, v, i) => { visitedRight.push(i); return acc; }, null);

const double = (n) => n * 2;
const increment = (n) => n + 1;

// compose applies right to left; pipe applies left to right.
const compose = (...fns) => (x) => fns.reduceRight((v, f) => f(v), x);
const pipe = (...fns) => (x) => fns.reduce((v, f) => f(v), x);

const emptyRight = (() => {
  try { return [].reduceRight((a, b) => a + b); } catch (e) { return e.constructor.name; }
})();

console.log('reduce      :', letters.reduce((a, b) => a + b));
console.log('reduceRight :', letters.reduceRight((a, b) => a + b));
console.log('indexes visited by reduceRight:', visitedRight);
console.log('--- subtraction is not symmetric ---');
console.log('reduce      : 10 - 3 - 2 =', nums.reduce((a, b) => a - b));
console.log('reduceRight :  2 - 3 - 10 =', nums.reduceRight((a, b) => a - b));
console.log('compose(double, increment)(5):', compose(double, increment)(5), '<- increment first');
console.log('pipe(double, increment)(5)   :', pipe(double, increment)(5), '<- double first');

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25function cumulative(xs) {
  let total = 0;
  return xs.map((n) => (total += n));           // += evaluates to the new total
}

const runningMax = (xs) => {
  let best = -Infinity;
  return xs.map((n) => (best = Math.max(best, n)));
};

// The same thing with reduce, which copies the accumulator on every step.
const cumulativeReduce = (xs) => xs.reduce((acc, n) => [...acc, (acc.at(-1) ?? 0) + n], []);

// The inverse: differences.
const differences = (totals) => totals.map((t, i) => (i === 0 ? t : t - totals[i - 1]));

const sales = [1, 2, 3, 4];

console.log('input        :', sales);
console.log('running sum  :', cumulative(sales));
console.log('reduce version:', cumulativeReduce(sales));
console.log('running max  :', runningMax([1, 3, 2, 5, 4]));
console.log('differences  :', differences(cumulative(sales)), '<- back to the input');
console.log('the last total is the sum:', cumulative(sales).at(-1));
console.log('empty        :', cumulative([]));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25const unique = (xs) => [...new Set(xs)];
const uniqueOldWay = (xs) => xs.filter((v, i, all) => all.indexOf(v) === i);

// Unique by a computed key, which a Set alone cannot do for objects.
function uniqueBy(xs, keyOf) {
  const seen = new Set();
  return xs.filter((x) => {
    const key = keyOf(x);
    if (seen.has(key)) return false;
    seen.add(key);
    return true;
  });
}

const rows = [{ id: 1, n: 'a' }, { id: 2, n: 'b' }, { id: 1, n: 'again' }];

console.log('unique      :', unique([1, 2, 2, 3, 1]));
console.log('order kept  :', unique(['b', 'a', 'b']));
console.log('old idiom   :', uniqueOldWay([1, 2, 2, 3, 1]));
console.log('--- NaN ---');
console.log('Set     :', unique([NaN, NaN]).length, 'value');
console.log('indexOf :', uniqueOldWay([NaN, NaN]).length, 'values <- both dropped');
console.log('--- objects ---');
console.log('two lookalikes stay:', unique([{ id: 1 }, { id: 1 }]).length);
console.log('uniqueBy id       :', uniqueBy(rows, (r) => r.id).map((r) => r.n));

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27const union = (a, b) => [...new Set([...a, ...b])];

const intersection = (a, b) => {
  const inB = new Set(b);                       // one Set, then n lookups
  return [...new Set(a)].filter((v) => inB.has(v));
};

const difference = (a, b) => {
  const inB = new Set(b);
  return [...new Set(a)].filter((v) => !inB.has(v));
};

const symmetric = (a, b) => [...difference(a, b), ...difference(b, a)];

const a = [1, 2, 3, 4];
const b = [3, 4, 5];

const hasSetMethods = typeof new Set().union === 'function';
const builtInUnion = hasSetMethods ? [...new Set(a).union(new Set(b))] : union(a, b);

console.log('union        :', union(a, b));
console.log('intersection :', intersection(a, b));
console.log('a minus b    :', difference(a, b));
console.log('b minus a    :', difference(b, a), '<- not the same question');
console.log('symmetric    :', symmetric(a, b));
console.log('duplicates do not multiply:', intersection([3, 3, 4], [3, 4]));
console.log('Set methods available?', hasSetMethods, '->', builtInUnion);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27function firstDuplicate(xs) {
  const seen = new Set();
  for (const v of xs) {
    if (seen.has(v)) return v;
    seen.add(v);
  }
  return undefined;
}

const allDuplicates = (xs) => {
  const seen = new Set();
  const twice = new Set();
  for (const v of xs) (seen.has(v) ? twice : seen).add(v);
  return [...twice];
};

const hasDuplicate = (xs) => new Set(xs).size !== xs.length;

const shared = {};

console.log('[1, 2, 3, 2]  ->', firstDuplicate([1, 2, 3, 2]));
console.log('[5, 9, 9, 5]  ->', firstDuplicate([5, 9, 9, 5]), '<- 9 repeats first');
console.log('[1, 2, 3]     ->', firstDuplicate([1, 2, 3]));
console.log('all duplicates:', allDuplicates([1, 2, 2, 3, 3, 3]));
console.log('any duplicate?', hasDuplicate([1, 2, 3]), hasDuplicate([1, 1]));
console.log('NaN           ->', firstDuplicate([NaN, NaN]), '<- a Set can hold it');
console.log('objects       ->', firstDuplicate([shared, {}, shared]) === shared);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23const shallowEqual = (a, b) =>
  a.length === b.length && a.every((v, i) => v === b[i]);

function deepEqual(a, b) {
  if (Array.isArray(a) && Array.isArray(b)) {
    return a.length === b.length && a.every((v, i) => deepEqual(v, b[i]));
  }
  return a === b;
}

const one = [1, 2];
const alsoOne = one;

console.log('[1, 2] === [1, 2] :', [1, 2] === [1, 2], '<- two different objects');
console.log('one === alsoOne   :', one === alsoOne, '<- one object, two names');
console.log('shallowEqual      :', shallowEqual([1, 2], [1, 2]));
console.log('order matters     :', shallowEqual([1, 2], [2, 1]));
console.log('--- nesting ---');
console.log('shallow on nested :', shallowEqual([[1]], [[1]]), '<- inner arrays are different objects');
console.log('deep on nested    :', deepEqual([[1]], [[1]]));
console.log('--- the JSON shortcut ---');
console.log('JSON of [undefined]:', JSON.stringify([undefined]));
console.log('JSON of [null]     :', JSON.stringify([null]), '<- identical, so JSON cannot tell them apart');