Graphviz is a suite of open source graph drawing tools of over 30 years’ vintage. Viz.js is a WebAssembly Graphviz build that brings its functionality into the browser. GitHub repo.
Michael Daines
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6👍2🔥1
CHALLENGE
class Observable {
constructor(subscriber) {
this.subscriber = subscriber;
}
subscribe(observer) {
return this.subscriber(observer);
}
map(fn) {
return new Observable(observer => {
return this.subscribe({
next: value => observer.next(fn(value)),
error: err => observer.error(err),
complete: () => observer.complete()
});
});
}
}
const source = new Observable(observer => {
observer.next(1);
observer.next(2);
observer.complete();
});
const doubled = source.map(x => x * 2);
doubled.subscribe({
next: value => console.log(value),
complete: () => console.log('done')
});❤2
What is the output?
Anonymous Quiz
17%
1 2 done
53%
2 4 done
20%
undefined undefined done
11%
[object Object] [object Object] done
❤4👍1🔥1
Please open Telegram to view this post
VIEW IN TELEGRAM
❤2👍1🔥1
CHALLENGE
const a = 9007199254740991n;
const b = BigInt(9007199254740991);
const c = 9007199254740992;
const d = BigInt(9007199254740992);
console.log(a === b);
console.log(Number(a) === c);
console.log(c === Number.MAX_SAFE_INTEGER + 1);
console.log(d > a);
console.log(typeof (a + 1n));
console.log(Number(d) === c);
What is the output?
Anonymous Quiz
22%
true true true true bigint true
41%
true false true true bigint true
29%
false true true false number true
9%
true true false true bigint false
❤3
CHALLENGE
const userInput = "<script>alert('xss')</script>";
const sanitized = userInput
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''');
const credentials = {
username: 'admin',
password: 'secret123'
};
const safeLog = (obj) => {
const { password, ...safe } = obj;
return JSON.stringify(safe);
};
console.log(sanitized);
console.log(safeLog(credentials));CHALLENGE
const wm = new WeakMap();
const obj1 = {};
const obj2 = {};
const obj3 = obj1;
wm.set(obj1, 'first');
wm.set(obj2, 'second');
wm.set(obj3, 'third');
console.log(wm.get(obj1));
console.log(wm.get(obj2));
console.log(wm.get(obj3));
console.log(wm.has(obj1));
console.log(wm.size);
What is the output?
Anonymous Quiz
28%
third second third true undefined
25%
third second first true 2
36%
first second third true 3
11%
first second first false undefined
🔥3❤2👍1
CHALLENGE
const data = '{"name": "Maria", "age": 25, "skills": ["JavaScript", "Python"]}';
try {
const parsed = JSON.parse(data);
const modified = {
...parsed,
age: parsed.age + 5,
skills: [...parsed.skills, "TypeScript"]
};
const serialized = JSON.stringify(modified, null, 0);
const reparsed = JSON.parse(serialized);
console.log(reparsed.skills.length);
console.log(typeof reparsed.age);
} catch (error) {
console.log('Parse error');
}❤7
👍4🔥2🤔2❤1
CHALLENGE
const numbers = [1, 2, 3, 4, 5];
const pipeline = (...fns) => (value) => fns.reduce((acc, fn) => fn(acc), value);
const multiply = (x) => (y) => x * y;
const add = (x) => (y) => x + y;
const square = (x) => x * x;
const transform = pipeline(
multiply(2),
add(3),
square
);
const result = numbers.map(transform);
console.log(result);
👍6❤3
What is the output?
Anonymous Quiz
22%
[4, 16, 36, 64, 100]
54%
[25, 49, 81, 121, 169]
18%
[16, 36, 64, 100, 144]
6%
[9, 25, 49, 81, 121]
👍3❤2
The latest cutting edge version of Node has arrived with Web Storage enabled by default, JSON.stringify perf improvements, a new --allow-net option in the permission model, built-in Uint8Array base64/hex conversion, and WebAssembly and JIT optimizations. As shown in the diagram above, this means Node 24 will soon be promoted to being the 'active' LTS release and Node 22 will enter its 'maintenance' LTS phase.
Rafael Gonzaga
Please open Telegram to view this post
VIEW IN TELEGRAM
👍12❤4🔥1
CHALLENGE
function Vehicle(type) {
this.type = type;
}
Vehicle.prototype.describe = function() {
return `This is a ${this.type}`;
};
function Car(brand) {
Vehicle.call(this, 'car');
this.brand = brand;
}
Car.prototype = Object.create(Vehicle.prototype);
Car.prototype.constructor = Car;
Car.prototype.describe = function() {
return Vehicle.prototype.describe.call(this) + ` made by ${this.brand}`;
};
const tesla = new Car('Tesla');
console.log(tesla.describe());
console.log(tesla.constructor.name);❤2
What is the output?
Anonymous Quiz
29%
This is a Tesla made by Tesla Car
39%
This is a car made by Tesla Car
18%
This is a Tesla Vehicle
14%
This is a car made by Tesla Vehicle
1❤4🔥2👍1
A minimal CheatEngine implementation built with Rust and a terminal UI.
Do you think it’s possible to create something similar with JavaScript?
Do you think it’s possible to create something similar with JavaScript?
👍3❤2🤔2🔥1
CHALLENGE
const Maybe = {
of: (value) => ({ value, map: f => value == null ? Maybe.nothing() : Maybe.of(f(value)) }),
nothing: () => ({ value: null, map: () => Maybe.nothing() })
};
const result = Maybe.of(5)
.map(x => x * 2)
.map(x => x > 15 ? null : x)
.map(x => x + 1)
.map(x => x.toString());
console.log(result.value);🤔8❤2👍2
🤔7❤3👍3
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);
}
removeAllListeners() {
this.listeners.clear();
}
}
const manager = new EventManager();
const obj = { data: new Array(1000).fill('memory') };
manager.addListener('test', () => obj.data.length);
manager.removeAllListeners();
console.log(manager.listeners.size);