Data structures all 4 written

example.mjs

1
2
3
4
5
6
7
8const colours = ["red", "green", "blue"];

console.log(colours[0], colours[2], colours[3]);   // positions start at 0
console.log(colours.at(-1), colours.length);
console.log(colours.includes("green"), colours.indexOf("blue"), colours.indexOf("pink"));

check("reading past the end is undefined, not an error", colours[3], undefined);
check("at(-1) is the last item", colours.at(-1), "blue");

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13const queue = ["b", "c"];

queue.push("d");          // add to the end
queue.unshift("a");       // add to the start
console.log(queue);

const last = queue.pop();     // remove from the end
const first = queue.shift();  // remove from the start
console.log(first, last, queue);

check("push and pop work at the end", last, "d");
check("unshift and shift work at the start", first, "a");
check("and all four changed the array itself", queue, ["b", "c"]);

example.mjs

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 original = [3, 1, 2];
const run = (name, fn) => {
  const copy = [...original];
  const result = fn(copy);
  const changed = copy.join() !== original.join();
  console.log(name.padEnd(28), changed ? "CHANGES the array " : "leaves it alone    ", JSON.stringify(result));
  return changed;
};

const mutators = [
  run("push(4)", (a) => a.push(4)),
  run("sort()", (a) => a.sort()),
  run("reverse()", (a) => a.reverse()),
  run("splice(0, 1)", (a) => a.splice(0, 1)),
  run("fill(0)", (a) => a.fill(0)),
];
console.log();
const pure = [
  run("slice(0, 1)", (a) => a.slice(0, 1)),
  run("map(n => n * 2)", (a) => a.map((n) => n * 2)),
  run("concat([4])", (a) => a.concat([4])),
  run("toSorted()", (a) => a.toSorted()),
  run("toReversed()", (a) => a.toReversed()),
  run("toSpliced(0, 1)", (a) => a.toSpliced(0, 1)),
  run("with(0, 9)", (a) => a.with(0, 9)),
];

check("these five change the array they are called on", mutators.every(Boolean), true);
check("these seven never do", pure.some(Boolean), false);

example.mjs

1
2
3
4
5
6
7
8
9
10
11const letters = ["a", "b", "c", "d", "e"];

console.log(letters.slice(1, 3));          // copy positions 1 up to (not including) 3
console.log(letters);                      // unchanged

const removed = letters.splice(1, 2, "X"); // at 1, remove 2, insert "X"
console.log(removed, letters);             // changed

check("slice copies a range", ["a", "b", "c", "d", "e"].slice(1, 3), ["b", "c"]);
check("splice returns what it removed", removed, ["b", "c"]);
check("and edits the array in place", letters, ["a", "X", "d", "e"]);

example.mjs

1
2
3
4
5
6
7
8
9
10const a = [1, 2, 3];
const alias = a;         // the same array, under another name
const copy = [...a];     // a new array with the same items

a.push(4);

console.log(alias, copy);

check("the alias saw the push", alias, [1, 2, 3, 4]);
check("the copy did not", copy, [1, 2, 3]);

example.mjs

1
2
3
4
5
6
7
8console.log(Array.from({ length: 4 }, (_, i) => i * i));
console.log(Array.from("héllo"));
console.log(new Array(3));
console.log([[1, 2], [3], [4, [5]]].flat());
console.log(["a b", "c d"].flatMap((s) => s.split(" ")));

check("Array.from with a function builds and fills", Array.from({ length: 4 }, (_, i) => i * i), [0, 1, 4, 9]);
check("flat removes one level of nesting", [[1, 2], [3]].flat(), [1, 2, 3]);

example.mjs

1
2
3
4
5
6
7const grid = new Array(3).fill([]);   // looks like three empty rows

grid[0].push("x");

console.log(grid);

check("all three rows are the same array", grid[0] === grid[2], true);

example.mjs

1
2
3
4
5
6
7
8const grid = Array.from({ length: 3 }, () => []);   // a new array for each row

grid[0].push("x");

console.log(grid);

check("each row is its own array", grid[0] === grid[2], false);
check("so only the first row changed", grid, [["x"], [], []]);

example.mjs

1
2
3
4console.log(typeof [], Array.isArray([]), Array.isArray({ length: 0 }));

check("typeof cannot tell you", typeof [], "object");
check("Array.isArray can", Array.isArray([]), true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21const key = "favourite colour";
const name = "Ada";

const person = {
  name,                         // shorthand for name: name
  born: 1815,
  [key]: "green",               // a computed key
  describe() {                  // a method
    return `${this.name}, born ${this.born}`;
  },
};

console.log(person.name, person["favourite colour"], person[key]);
console.log(person.describe());

person.email = "ada@example.com";   // add a property
delete person.born;                  // remove one
console.log(Object.keys(person));

check("bracket notation reaches any key", person["favourite colour"], "green");
check("properties can be added and removed", Object.keys(person), ["name", "favourite colour", "describe", "email"]);

example.mjs

1
2
3
4
5
6
7
8
9const config = { port: 8080, host: undefined };

console.log(config.host === undefined, config.debug === undefined);   // cannot tell them apart
console.log("host" in config, "debug" in config);
console.log(Object.hasOwn(config, "host"), Object.hasOwn(config, "toString"));
console.log("toString" in config, "<- in also sees inherited properties");

check("in: the key exists, even holding undefined", "host" in config, true);
check("hasOwn ignores what the object inherits", Object.hasOwn(config, "toString"), false);

example.mjs

1
2
3
4
5const sizes = { large: 3, "10": "ten", small: 1, "2": "two", medium: 2 };

console.log(Object.keys(sizes));

check("integer-like keys go first, in number order", Object.keys(sizes), ["2", "10", "large", "small", "medium"]);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12function applyDiscount(order) {
  order.total = order.total * 0.9;     // changes the caller's object
  return order;
}

const mine = { id: 1, total: 100 };
const result = applyDiscount(mine);

console.log(mine, result === mine);

check("the function changed the object it was given", mine.total, 90);
check("and returned the very same object", result === mine, true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11function withDiscount(order) {
  return { ...order, total: order.total * 0.9 };   // a new object; the original is untouched
}

const mine = { id: 1, total: 100 };
const discounted = withDiscount(mine);

console.log(mine, discounted);

check("the original is unchanged", mine.total, 100);
check("the new object has the discount", discounted.total, 90);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12const original = { name: "Ada", address: { city: "London" } };
const copy = { ...original };

copy.name = "Grace";               // top level: copied
copy.address.city = "New York";    // nested: shared

console.log(original);
console.log(copy);

check("top-level properties were copied", original.name, "Ada");
check("the nested object is shared by both", original.address === copy.address, true);
check("so changing it through the copy changed the original", original.address.city, "New York");

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18const original = {
  name: "Ada",
  address: { city: "London" },
  joined: new Date("2020-01-15T00:00:00Z"),
  tags: new Set(["admin"]),
};
const deep = structuredClone(original);

deep.address.city = "New York";
deep.tags.add("owner");

console.log(original.address.city, [...original.tags]);
console.log(deep.address.city, [...deep.tags]);
console.log(deep.joined instanceof Date);

check("nothing is shared any more", original.address.city, "London");
check("a Set was deep-copied too", original.tags.has("owner"), false);
check("and a Date stayed a Date", deep.joined instanceof Date, true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15const settings = Object.freeze({ theme: "dark", limits: { upload: 10 } });

let refused;
try {
  settings.theme = "light";
} catch (err) {
  refused = err.name;
}
settings.limits.upload = 999;     // the nested object was never frozen

console.log(settings, refused);

check("the top level is read-only", settings.theme, "dark");
check("writing to it throws in a module", refused, "TypeError");
check("but the nested object is not frozen", settings.limits.upload, 999);

example.mjs

1
2
3
4
5
6
7
8
9
10
11const pricesInPence = { tea: 250, cake: 400, water: 0 };

const inPounds = Object.fromEntries(
  Object.entries(pricesInPence)
    .filter(([, p]) => p > 0)
    .map(([item, p]) => [item, p / 100]),
);

console.log(inPounds);

check("entries -> filter/map -> fromEntries", inPounds, { tea: 2.5, cake: 4 });

example.mjs

1
2
3
4
5
6
7
8
9import { isDeepStrictEqual } from "node:util";

const a = { id: 1, tags: ["x"] };
const b = { id: 1, tags: ["x"] };

console.log(a === b, isDeepStrictEqual(a, b));

check("=== asks: the same object?", a === b, false);
check("isDeepStrictEqual asks: the same contents?", isDeepStrictEqual(a, b), true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15function countWords(text) {
  const counts = {};
  for (const word of text.split(" ")) {
    counts[word] = (counts[word] || 0) + 1;
  }
  return counts;
}

const counts = countWords("the constructor calls the builder");
console.log(counts.the, counts.builder);
console.log(typeof counts.constructor, "starting", JSON.stringify(counts.constructor.slice(0, 15)));

check("ordinary words count fine", counts.the, 2);
check("but 'constructor' was already there", typeof counts.constructor, "string");
check("so its count is garbage", counts.constructor.endsWith("1"), true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14const byId = {};
byId[1] = "one";
byId["1"] = "the string one";

const a = { id: "a" };
const b = { id: "b" };
const labels = {};
labels[a] = "first object";
labels[b] = "second object";

console.log(byId, Object.keys(labels));

check("the number 1 and the string '1' are the same key", Object.keys(byId), ["1"]);
check("every object key becomes the same string", Object.keys(labels), ["[object Object]"]);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14function countWords(text) {
  const counts = new Map();
  for (const word of text.split(" ")) {
    counts.set(word, (counts.get(word) ?? 0) + 1);
  }
  return counts;
}

const counts = countWords("the constructor calls the builder");
console.log(counts);
console.log(counts.get("constructor"), counts.size);

check("Map starts genuinely empty", countWords("constructor").get("constructor"), 1);
check("size is a property, not a loop", counts.size, 4);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16const a = { id: "a" };
const b = { id: "b" };

const labels = new Map([
  [a, "first object"],
  [b, "second object"],
  [1, "the number one"],
  ["1", "the string one"],
]);

console.log(labels.get(a), labels.get(b));
console.log(labels.get(1), labels.get("1"));
console.log(labels.has(a), labels.delete(b), labels.has(b));

check("objects work as keys, by identity", labels.get(a), "first object");
check("1 and '1' are different keys", labels.get(1) === labels.get("1"), false);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13const scores = new Map([["ada", 91], ["alan", 78], ["grace", 88]]);

for (const [name, score] of scores) {
  console.log(name.padEnd(6), score);
}

const asObject = Object.fromEntries(scores);        // Map -> object, for JSON
const back = new Map(Object.entries(asObject));     // and back

console.log(JSON.stringify(asObject));

check("a Map keeps insertion order", [...scores.keys()], ["ada", "alan", "grace"]);
check("and round-trips through an object", back.get("grace"), 88);

example.mjs

1
2
3
4
5
6
7
8
9const visits = ["home", "about", "home", "blog", "about", "home"];
const unique = new Set(visits);

console.log(unique, unique.size);
console.log([...unique]);
console.log(unique.has("blog"), unique.has("shop"));

check("a Set keeps one of each", [...unique], ["home", "about", "blog"]);
check("the shortest way to de-duplicate an array", [...new Set([3, 1, 3, 2, 1])], [3, 1, 2]);

example.mjs

1
2
3
4
5
6
7
8
9
10const frontend = new Set(["ada", "grace", "linus"]);
const backend = new Set(["alan", "grace", "linus"]);

console.log(frontend.union(backend));
console.log(frontend.intersection(backend));
console.log(frontend.difference(backend));
console.log(frontend.isSubsetOf(new Set(["ada", "grace", "linus", "ken"])));

check("people on both teams", [...frontend.intersection(backend)], ["grace", "linus"]);
check("frontend only", [...frontend.difference(backend)], ["ada"]);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18const ids = Array.from({ length: 20_000 }, (_, i) => `user-${i}`);
const idSet = new Set(ids);
const lookups = Array.from({ length: 2_000 }, (_, i) => `user-${i * 10}`);

let t = performance.now();
const inArray = lookups.filter((id) => ids.includes(id)).length;
const arrayMs = performance.now() - t;

t = performance.now();
const inSet = lookups.filter((id) => idSet.has(id)).length;
const setMs = performance.now() - t;

console.log(`array.includes: ${arrayMs.toFixed(1)} ms`);
console.log(`set.has:        ${setMs.toFixed(2)} ms`);
console.log(`about ${Math.round(arrayMs / setMs)} times faster`);

check("both found the same ids", inArray, inSet);
check("and the Set was far faster", arrayMs > setMs * 10, true);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13const user = { id: 7, name: "Ada", email: "ada@example.com", role: undefined };

const { name, email } = user;                    // pick properties by name
const { id: userId } = user;                     // rename while picking
const { role = "member" } = user;                // a default, for undefined
const { name: _n, ...withoutName } = user;       // collect everything else

console.log(name, email, userId, role);
console.log(withoutName);

check("destructuring reads properties by name", [name, userId], ["Ada", 7]);
check("a default fills in undefined", role, "member");
check("...rest collects the remaining properties", Object.keys(withoutName), ["id", "email", "role"]);

example.mjs

1
2
3
4
5
6
7
8
9
10function connect({ host = "127.0.0.1", port = 5432, ssl = false } = {}) {
  return `${ssl ? "tls" : "tcp"}://${host}:${port}`;
}

console.log(connect({ port: 6543 }));
console.log(connect({ host: "db.internal", ssl: true }));
console.log(connect());

check("unnamed options fall back to defaults", connect({ port: 6543 }), "tcp://127.0.0.1:6543");
check("the = {} makes calling with nothing safe", connect(), "tcp://127.0.0.1:5432");

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14const [first, second, ...others] = ["gold", "silver", "bronze", "fourth"];
const [, , third] = ["a", "b", "c"];         // skip positions with commas

let x = 1;
let y = 2;
[x, y] = [y, x];                              // swap without a temporary variable

console.log(first, second, others, third, x, y);

const entries = Object.entries({ a: 1, b: 2 });
for (const [key, value] of entries) console.log(key, "=", value);

check("array destructuring is by position", [first, second], ["gold", "silver"]);
check("the swap worked", [x, y], [2, 1]);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16const defaults = { theme: "light", fontSize: 14, beta: false };
const saved = { fontSize: 18 };

const settings = { ...defaults, ...saved };             // later keys win
const reversed = { ...saved, ...defaults };             // so order matters

const base = [1, 2];
const more = [0, ...base, 3];

console.log(settings);
console.log(reversed);
console.log(more);

check("the user's setting overrides the default", settings.fontSize, 18);
check("put the defaults last and they win instead", reversed.fontSize, 14);
check("spread works in arrays too", more, [0, 1, 2, 3]);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13const order = { id: 42, items: ["tea", "cake"], paid: true, note: null };

const text = JSON.stringify(order);
const pretty = JSON.stringify(order, null, 2);    // indented, for people
const back = JSON.parse(text);

console.log(text);
console.log(pretty);
console.log(back.items[1], back === order);

check("stringify gives a string", typeof text, "string");
check("parse gives back an equal object", back, order);
check("but not the same object", back === order, false);

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19const record = {
  name: "Ada",
  nickname: undefined,               // vanishes
  greet() { return "hi"; },          // vanishes
  joined: new Date("2024-03-01T09:00:00Z"),   // becomes a string
  tags: new Set(["admin"]),          // becomes {}
  score: 0 / 0,                      // NaN becomes null
};

const text = JSON.stringify(record);
const back = JSON.parse(text);

console.log(text);
console.log(typeof back.joined, back.tags, back.score);

check("undefined and functions are dropped", "nickname" in back || "greet" in back, false);
check("a Date comes back as a string", typeof back.joined, "string");
check("a Set comes back as an empty object", back.tags, {});
check("NaN comes back as null", back.score, null);

example.mjs

1
2
3
4
5
6
7
8
9const text = '{"name":"Ada","joined":"2024-03-01T09:00:00.000Z"}';

const user = JSON.parse(text, (key, value) =>
  key === "joined" ? new Date(value) : value,
);

console.log(user.joined instanceof Date, user.joined.getUTCFullYear());

check("a reviver turns the string back into a Date", user.joined instanceof Date, true);

example.mjs

1
2
3
4
5
6
7
8class Money {
  constructor(pence) { this.pence = pence; }
  toJSON() { return (this.pence / 100).toFixed(2); }   // what JSON.stringify should use
}

console.log(JSON.stringify({ price: new Money(1999) }));

check("toJSON controls how an object serialises", JSON.stringify({ p: new Money(250) }), '{"p":"2.50"}');

example.mjs

1
2
3
4
5
6
7
8
9
10
11
12
13function parseOrNull(text) {
  try {
    return JSON.parse(text);
  } catch {
    return null;
  }
}

console.log(parseOrNull('{"ok": true}'), parseOrNull("{ok: true}"), parseOrNull(""));

check("good JSON parses", parseOrNull('{"ok": true}'), { ok: true });
check("bad JSON gives null instead of crashing", parseOrNull("{ok: true}"), null);
check("so does an empty body", parseOrNull(""), null);