Channel Public Channel

JavaScript

@javascript

A resourceful newsletter featuring the latest and most important news, articles, books and updates in the world of #javascript 🚀 Don't miss our Quizzes!

Let's chat: @nairihar

Open in Telegram

Subscribers: 31.1K
Photos: 1.2K
Videos: 10
Links: 895

Showing posts older than #2617 · Back to latest

Older Posts 20 shown

Post #2616 4.01K Sep 7, 2025, 06:32 UTC

👍 3
🔥 3
❤ 2

Post #2615 4.02K Sep 7, 2025, 06:32 UTC

CHALLENGE

const data = { a: 1, b: 2, c: 3 };
const { a, ...rest } = data;
const newObj = { ...rest, a, d: 4 };

const arr = [1, 2, 3, 4, 5];
const [first, , third, ...remaining] = arr;
const result = [...remaining, third, first];

console.log(newObj);
console.log(result);

Post #2614 4.27K Sep 6, 2025, 13:05 UTC

🙂 Mediabunny: A Complete Media Toolkit for JavaScript

Supporting both browsers and Node.js, this library lets you read, write and convert popular media file formats (e.g. MP4, MP3, and more) without needing to lean on dependencies like FFmpeg. You can make thumbnails, extract metadata, write code that gets converted into a video, and more. GitHub repo.

Vanilagy

❤ 8
🔥 4
👍 3
🤩 1

Post #2613 3.66K Sep 6, 2025, 06:33 UTC

❤ 4
👍 3
🔥 2

Post #2612 3.84K Sep 6, 2025, 06:33 UTC

CHALLENGE

class EventManager {
  constructor() {
    this.listeners = new Map();
  }
  
  addListener(event, callback) {
    if (!this.listeners.has(event)) {
      this.listeners.set(event, new Set());
    }
    this.listeners.get(event).add(callback);
  }
  
  removeListener(event, callback) {
    this.listeners.get(event)?.delete(callback);
  }
}

const manager = new EventManager();
const handler = () => console.log('handled');
manager.addListener('click', handler);
manager.removeListener('click', () => console.log('handled'));
console.log(manager.listeners.get('click').size);

Post #2611 3.77K Sep 5, 2025, 06:31 UTC

Post #2610 3.62K Sep 5, 2025, 06:31 UTC

CHALLENGE

function highlight(strings, ...values) {
  return strings.reduce((result, string, i) => {
    const value = values[i] ? `<mark>${values[i]}</mark>` : '';
    return result + string + value;
  }, '');
}

const name = 'Sarah';
const age = 25;
const template = highlight`Hello ${name}, you are ${age} years old!`;
console.log(template);

const empty = highlight`No interpolation here`;
console.log(empty);

❤ 8

Post #2609 3.76K Sep 4, 2025, 22:09 UTC

📸 Did you know you can now preconfigure your AI codegen tools when creating a new hashtag #Angular app?

Use this command (insert your preferred tool)

❤ 9
👍 3
🔥 2

Post #2608 4.14K Sep 4, 2025, 06:32 UTC

🤔 3

Post #2607 3.92K Sep 4, 2025, 06:32 UTC

CHALLENGE

function processData() {
  try {
    console.log('start');
    throw new Error('oops');
    console.log('after throw');
  } catch (e) {
    console.log('catch');
    return 'caught';
  } finally {
    console.log('finally');
  }
  console.log('end');
}

const result = processData();
console.log(result);

❤ 4
👍 3
🤩 1

Post #2606 3.87K Sep 3, 2025, 19:07 UTC

🤩 Cornerstone3D 4.0: Build Web-Based Medical Imaging Apps

A set of JavaScript libraries to build things like this 3D CT scan viewer, PET-CT scan viewer, and much more besides. There’s a lot to this project, along with numerous tutorials.

Open Health Imaging Foundation

❤ 4
👍 3
🔥 2

Post #2605 3.97K Sep 3, 2025, 06:33 UTC

❤ 9
🔥 2
👍 1

Post #2604 3.8K Sep 3, 2025, 06:33 UTC

CHALLENGE

const obj = {
  name: 'Sarah',
  getName() { return this.name; },
  getNameArrow: () => this.name
};

const { getName, getNameArrow } = obj;
const boundGetName = obj.getName.bind(obj);

console.log(getName());
console.log(getNameArrow());
console.log(boundGetName());
console.log(obj.getName());
console.log(obj.getNameArrow());

❤ 2

Post #2603 4.36K Sep 2, 2025, 23:08 UTC

📸 The Hidden Costs of Angular Updates.

📅 September 3, 4 PM UTC
🎙 Host: Armen Vardanyan
🎤 Guest: Gérôme Grignon

We’ll cover:
- What ng update does well
- Where the hidden costs appear in real projects
- Refactoring & dependency pitfalls
- How upgrades affect teams & long-term maintainability

Check the Linkedin post to learn more.

❤ 7
👍 3
🔥 1

Post #2602 3.67K Sep 2, 2025, 06:34 UTC

Post #2601 3.94K Sep 2, 2025, 06:34 UTC

CHALLENGE

const userInput = "<script>alert('xss')</script>";
const sanitized = userInput.replace(/<script[^>]*>.*?<\/script>/gi, '');

const users = new Map();
users.set('admin', { password: 'secret123', role: 'admin' });
users.set('guest', { password: 'guest', role: 'user' });

function authenticate(username, password) {
  const user = users.get(username);
  return user && user.password === password ? user.role : null;
}

const role1 = authenticate('admin', 'secret123');
const role2 = authenticate('guest', 'wrong');
const role3 = authenticate('hacker', 'secret123');

console.log(sanitized);
console.log(role1, role2, role3);

❤ 4
👍 3
🔥 1

Post #2600 3.96K Sep 1, 2025, 06:34 UTC

❤ 2
👍 2
🔥 2

Post #2599 4.1K Sep 1, 2025, 06:34 UTC

CHALLENGE

class StateMachine {
  constructor() {
    this.state = 'idle';
    this.transitions = {
      idle: { start: 'running' },
      running: { pause: 'paused', stop: 'idle' },
      paused: { resume: 'running', stop: 'idle' }
    };
  }
  
  transition(action) {
    const validTransitions = this.transitions[this.state];
    if (validTransitions && validTransitions[action]) {
      this.state = validTransitions[action];
      return true;
    }
    return false;
  }
}

const machine = new StateMachine();
console.log(machine.transition('pause'));
console.log(machine.state);
console.log(machine.transition('start'));
console.log(machine.state);

🤩 2
❤ 1
👍 1

Post #2598 3.84K Aug 31, 2025, 06:31 UTC

❤ 5
👍 3
🔥 2

Post #2597 4.1K Aug 31, 2025, 06:31 UTC

CHALLENGE

const obj = { a: 1, b: { c: 2 } };
const frozen = Object.freeze(obj);
frozen.a = 99;
frozen.b.c = 88;
frozen.d = 77;

const sealed = Object.seal({ x: 10, y: 20 });
sealed.x = 30;
sealed.z = 40;
delete sealed.y;

console.log(obj.a, obj.b.c, obj.d);
console.log(sealed.x, sealed.y, sealed.z);

❤ 2

Older posts →