JavaScript

14 July 2026 08:30

CHALLENGE

const obj = {
  name: "Quantum",
  regular: function () {
    return this.name;
  },
  arrow: () => {
    return this?.name;
  },
  nested: function () {
    const inner = () => this.name;
    return inner();
  },
};

console.log(obj.regular());
console.log(obj.arrow());
console.log(obj.nested());

JavaScript

12 July 2026 08:33

CHALLENGE

console.log('start');

setTimeout(() => console.log('timeout 1'), 0);

Promise.resolve()
  .then(() => {
    console.log('promise 1');
    setTimeout(() => console.log('timeout 2'), 0);
  })
  .then(() => console.log('promise 2'));

setTimeout(() => console.log('timeout 3'), 0);

queueMicrotask(() => console.log('microtask'));

console.log('end');

JavaScript

11 July 2026 08:30

CHALLENGE

class Pipeline {
  #value;
  #steps = [];

  constructor(value) {
    this.#value = value;
  }

  map(fn) {
    this.#steps.push({ type: 'map', fn });
    return this;
  }

  filter(fn) {
    this.#steps.push({ type: 'filter', fn });
    return this;
  }

  execute() {
    return this.#steps.reduce((acc, step) => {
      if (step.type === 'map') return acc.map(step.fn);
      if (step.type === 'filter') return acc.filter(step.fn);
      return acc;
    }, this.#value);
  }
}

const result = new Pipeline([1, 2, 3, 4, 5, 6])
  .filter(x => x % 2 === 0)
  .map(x => x ** 2)
  .filter(x => x > 10)
  .map(x => x - 1)
  .execute();

console.log(result);

JavaScript

09 July 2026 15:00

😃 Wordgard: A New Rich Text Editor Library from ProseMirror's Creator

With Eloquent JavaScript and ProseMirror under his belt, not many people know more about JavaScript and making good editor controls than Marijn. Modular, supports collaborative editing, and thoughtfully built. Live demo and how to get started.

Marijn Haverbeke

JavaScript

08 July 2026 15:04

😮 Vite+ Beta: A Web Dev Toolchain Behind One Command

Vite+ is the Vite team’s ‘unified toolchain’ that brings Vite, Vitest, Oxlint, and similar tools together under a single vp command, whether for running a dev server, tests, formatting, or bundling.

VoidZero

💡 Vite+ was originally intended to be a commercial project to fund work on Vite and related projects, but was open sourced under the MIT license earlier this year.

JavaScript

07 July 2026 08:34

CHALLENGE

const compose = (...fns) => x => fns.reduceRight((acc, fn) => fn(acc), x);
const pipe = (...fns) => x => fns.reduce((acc, fn) => fn(acc), x);

const double = x => x * 2;
const addTen = x => x + 10;
const square = x => x * x;
const negate = x => -x;

const transform1 = compose(negate, square, addTen, double);
const transform2 = pipe(negate, square, addTen, double);

console.log(transform1(3));
console.log(transform2(3));

JavaScript

05 July 2026 08:32

CHALLENGE

const inventory = {
  warehouse: {
    shelves: [
      { id: 'A1', items: ['bolts', 'nuts', 'washers'] },
      { id: 'B2', items: ['hammers', 'wrenches'] },
    ],
    manager: { name: 'Carlos', shift: 'night' },
  },
};

const {
  warehouse: {
    shelves: [{ items: [firstItem, , thirdItem] }, { id: shelfId }],
    manager: { name, shift = 'day' },
  },
} = inventory;

console.log(`${name} | ${shift} | ${shelfId} | ${firstItem} | ${thirdItem}`);

JavaScript

04 July 2026 08:30

CHALLENGE

const handler = {
  get(target, prop, receiver) {
    if (prop in target) {
      return Reflect.get(target, prop, receiver) * 2;
    }
    return `missing:${prop}`;
  },
  set(target, prop, value) {
    if (typeof value !== "number") {
      throw new TypeError("Only numbers allowed");
    }
    return Reflect.set(target, prop, value * 10);
  },
  has(target, prop) {
    return prop.startsWith("x") ? false : prop in target;
  },
};

const store = new Proxy({ xRay: 5, score: 3 }, handler);

store.level = 4;

console.log(store.xRay);
console.log(store.score);
console.log(store.level);
console.log("xRay" in store);
console.log("score" in store);
console.log(store.missing);

JavaScript

02 July 2026 08:31

CHALLENGE

const inventory = [
  { name: "sword", type: "weapon", power: 85 },
  { name: "shield", type: "armor", power: 60 },
  { name: "bow", type: "weapon", power: 72 },
  { name: "helmet", type: "armor", power: 45 },
  { name: "dagger", type: "weapon", power: 91 },
];

const result = inventory
  .filter(item => item.type === "weapon")
  .map(item => ({ ...item, power: item.power * 1.1 }))
  .sort((a, b) => b.power - a.power)
  .reduce((acc, item, index) => {
    acc[index === 0 ? "best" : "rest"] ??= [];
    if (index === 0) acc.best = item.name;
    else acc.rest.push(item.name);
    return acc;
  }, {});

console.log(result.best, result.rest);

JavaScript

01 July 2026 07:45

🤖 Read more

JavaScript

30 June 2026 08:32

CHALLENGE

function highlight(strings, ...values) {
  return strings.reduce((result, str, i) => {
    const value = values[i - 1];
    const formatted =
      typeof value === "number"
        ? `[${value.toFixed(2)}]`
        : `<${String(value).toUpperCase()}>`;
    return result + formatted + str;
  });
}

const item = "sword";
const qty = 3;
const price = 9.5;

const output = highlight`You bought ${qty} ${item}s for $${price} each.`;
console.log(output);

JavaScript

29 June 2026 08:30

CHALLENGE

const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

async function processQueue(items) {
  const results = [];

  await items.reduce(async (prevPromise, item) => {
    await prevPromise;
    await delay(0);
    results.push(item * 2);
  }, Promise.resolve());

  return results;
}

processQueue([1, 2, 3, 4])
  .then((data) => console.log("Result:", data))
  .catch((err) => console.log("Error:", err.message));

Promise.resolve()
  .then(() => console.log("Microtask A"))
  .then(() => console.log("Microtask B"));

JavaScript

28 June 2026 08:30

CHALLENGE

function makeCounter(start = 0, step = 1) {
  let count = start;
  const history = [];

  return {
    increment() {
      count += step;
      history.push(count);
      return this;
    },
    decrement() {
      count -= step;
      history.push(count);
      return this;
    },
    getHistory: () => history,
    getCount: () => count,
  };
}

const counter = makeCounter(10, 3);
counter.increment().increment().decrement();

console.log(counter.getCount());
console.log(counter.getHistory());

JavaScript

26 June 2026 15:01

🌲 Node.js 26.4 Adds Package Maps

A minor release whose headline feature is the (experimental) implementation of package maps (which let Node resolve packages from a static JSON file rather than walking node_modules). Matteo Collina’s node:vfs subsystem also begins to make an appearance.

Antoine du Hamel

JavaScript

23 June 2026 08:31

CHALLENGE

const balance = 9007199254740991n; // Number.MAX_SAFE_INTEGER as BigInt
const fee = 1n;
const multiplier = 2n;

const total = (balance + fee) * multiplier;
const asNumber = Number(total);

const isSafe = Number.isSafeInteger(asNumber);
const isExact = BigInt(asNumber) === total;

console.log(`${total}n | safe: ${isSafe} | exact: ${isExact}`);

JavaScript

13 July 2026 08:34

CHALLENGE

const curry = (fn) => {
  const arity = fn.length;
  return function curried(...args) {
    if (args.length >= arity) {
      return fn(...args);
    }
    return (...moreArgs) => curried(...args, ...moreArgs);
  };
};

const volume = (l, w, h) => l * w * h;
const curriedVolume = curry(volume);

const withLength5 = curriedVolume(5);
const withLength5Width3 = withLength5(3);

console.log(typeof withLength5);
console.log(typeof withLength5Width3);
console.log(withLength5Width3(2));
console.log(curriedVolume(5)(3)(2) === withLength5(3)(2));

JavaScript

11 July 2026 15:00

🤖 Eve: A Next.js-Style Framework for Building Agents

A new framework from Vercel that provides Next.js-esque structure for building AI-powered agents using TypeScript and Markdown. It's quite Vercel-flavored by default, but I found you can run it entirely independently of Vercel with a few settings tweaks and your own keys. Project homepage.

Vercel

JavaScript

10 July 2026 15:04

🤟 Node.js 26.4 Adds Package Maps

A minor release whose headline feature is the (experimental) implementation of package maps (which let Node resolve packages from a static JSON file rather than walking node_modules). Matteo Collina’s node:vfs subsystem also begins to make an appearance.

Antoine du Hamel

JavaScript

09 July 2026 08:32

CHALLENGE

const compose = (...fns) => x => fns.reduceRight((acc, fn) => fn(acc), x);
const pipe = (...fns) => x => fns.reduce((acc, fn) => fn(acc), x);

const double = x => x * 2;
const addTen = x => x + 10;
const square = x => x ** 2;
const negate = x => -x;

const transform1 = compose(negate, square, addTen, double);
const transform2 = pipe(negate, square, addTen, double);

console.log(transform1(3));
console.log(transform2(3));

JavaScript

08 July 2026 08:32

CHALLENGE

const setA = new Set([1, 2, 3, 4, 5]);
const setB = new Set([3, 4, 5, 6, 7]);

const union = new Set([...setA, ...setB]);

const intersection = new Set([...setA].filter(x => setB.has(x)));

const differenceAB = new Set([...setA].filter(x => !setB.has(x)));

const symmetricDiff = new Set(
  [...setA, ...setB].filter(x => !(setA.has(x) && setB.has(x)))
);

console.log([...union].join(','));
console.log([...intersection].join(','));
console.log([...differenceAB].join(','));
console.log([...symmetricDiff].join(','));

JavaScript

06 July 2026 08:30

CHALLENGE

async function fetchData(id) {
  if (id <= 0) throw new Error("Invalid ID");
  return { id, value: id * 10 };
}

async function process() {
  const results = await Promise.allSettled([
    fetchData(1),
    fetchData(-1),
    fetchData(3),
  ]);

  results.forEach(({ status, value, reason }) => {
    if (status === "fulfilled") {
      console.log(`✅ ${value.id}: ${value.value}`);
    } else {
      console.log(`❌ ${reason.message}`);
    }
  });
}

process();

JavaScript

04 July 2026 14:30

😆

JavaScript

03 July 2026 07:34

😂

JavaScript

01 July 2026 15:02

🗓 FullCalendar 7.0: A Full Sized JavaScript Calendar

A Google Calendar-style experience for your own apps. Works with React, Vue and Angular (v7.0 adds Angular 22 support), but can be used with plain JavaScript. Here’s a demo where you can play with the themes and styling approaches. MIT licensed with commercial extensions.

FullCalendar LLC

JavaScript

30 June 2026 15:03

😃 A developer code-golfed a signal implementation to just 33 bytes (above). I had to stare at it for a solid minute before it clicked, but mercifully, a Redditor breaks down exactly what's going on.

JavaScript

29 June 2026 15:37

😂

JavaScript

28 June 2026 15:04

💻 Desktop Apps With deno desktop

Deno 2.9 (or the 'canary' build now) can turn JavaScript projects into self-contained apps on macOS, Windows, and Linux. Unlike Electron, you can opt to use the default OS WebView or a bundled Chromium backend, plus you get cross-compilation and automatic support for apps built on frameworks like Next.js and SvelteKit.

The Deno Project

JavaScript

27 June 2026 15:01

🤖 Eve: A Next.js-Style Framework for Building Agents

A new framework from Vercel that provides Next.js-esque structure for building AI-powered agents using TypeScript and Markdown. It's quite Vercel-flavored by default, but I found you can run it entirely independently of Vercel with a few settings tweaks and your own keys. Project homepage.

Vercel

JavaScript

26 June 2026 08:35

CHALLENGE

class EventEmitter {
  #listeners = new Map();

  on(event, listener) {
    if (!this.#listeners.has(event)) {
      this.#listeners.set(event, []);
    }
    this.#listeners.get(event).push(listener);
    return this;
  }

  emit(event, ...args) {
    const handlers = this.#listeners.get(event) ?? [];
    handlers.forEach(fn => fn(...args));
    return this;
  }

  once(event, listener) {
    const wrapper = (...args) => {
      listener(...args);
      this.off(event, wrapper);
    };
    return this.on(event, wrapper);
  }

  off(event, listener) {
    const updated = (this.#listeners.get(event) ?? []).filter(fn => fn !== listener);
    this.#listeners.set(event, updated);
    return this;
  }
}

const emitter = new EventEmitter();
const log = [];

emitter.on("data", val => log.push(`on:${val}`));
emitter.once("data", val => log.push(`once:${val}`));
emitter.on("data", val => log.push(`on2:${val}`));

emitter.emit("data", "A");
emitter.emit("data", "B");

console.log(log.join(", "));

JavaScript

22 June 2026 08:32

CHALLENGE

function Vehicle(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.describe = function () {
    return `${this.year} ${this.make} ${this.model}`;
  };
}

Vehicle.prototype.age = function (currentYear) {
  return currentYear - this.year;
};

const car = new Vehicle("Toyota", "Supra", 1998);
const truck = new Vehicle("Ford", "Raptor", 2021);

console.log(car.describe());
console.log(truck.age(2025));
console.log(car.constructor === Vehicle);
console.log(Object.getPrototypeOf(car) === Vehicle.prototype);