Channel: JavaScript
What is the output?
Anonymous Quiz
31%
1, 2, 1, 2
34%
1, 2, undefined, 1
21%
1, 2, 1, 1
14%
1, 2, 3, 4
CHALLENGE
const users = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' }
];
const userScores = new WeakMap();
// Set scores for users
userScores.set(users[0], 95);
userScores.set(users[1], 80);
// Remove reference to Bob
users[1] = null;
let sum = 0;
for (const user of users) {
if (user && userScores.has(user)) {
sum += userScores.get(user);
}
}
console.log(sum);
What is the output?
Anonymous Quiz
23%
Error: Invalid value used as weak map key
30%
175
35%
95
12%
undefined
Please open Telegram to view this post
VIEW IN TELEGRAM
CHALLENGE
class ShoppingCart {
constructor() {
if (ShoppingCart.instance) {
return ShoppingCart.instance;
}
this.items = [];
ShoppingCart.instance = this;
}
addItem(item) {
this.items.push(item);
}
getItems() {
return [...this.items];
}
}
const cart1 = new ShoppingCart();
const cart2 = new ShoppingCart();
cart1.addItem('Book');
cart2.addItem('Laptop');
console.log(cart1.getItems());
What is the output?
Anonymous Quiz
7%
[]
49%
['Book', 'Laptop']
18%
Error: Cannot read properties of undefined (reading 'push')
26%
['Book']
Big news from the Remix camp this week. About a year ago, Remix and React Router merged together reflecting their shared goals and code, but now it’s all change again. React Router is now basically what Remix originally intended to be, and so ‘Remix’ is rebooting as a model-first, low-dependency, Web API-centric full-stack framework built on Preact. It’ll no longer be a 'React framework' per se.
Michael Jackson and Ryan Florence
Please open Telegram to view this post
VIEW IN TELEGRAM
CHALLENGE
const team = {
lead: { name: 'Alice', projects: ['Alpha', 'Beta'] },
dev: { name: 'Bob', projects: ['Gamma'] },
tester: { name: 'Charlie', projects: [] }
};
const {
lead: { projects: [leadProject] },
dev: { projects: [devProject = 'Delta'] },
tester: { projects: [testerProject = 'Epsilon'] }
} = team;
console.log(`${leadProject}-${devProject}-${testerProject}`);
What is the output?
Anonymous Quiz
28%
Alpha-Gamma-Epsilon
27%
Alpha-Gamma-undefined
21%
undefined-Gamma-Epsilon
23%
Alpha-Delta-Epsilon
From the creators of the similar React Flow comes a customizable Svelte component for building node-based editors and interactive diagrams. Want examples?
webkid GmbH
Please open Telegram to view this post
VIEW IN TELEGRAM
CHALLENGE
const target = { a: 1, b: 2 };
const handler = {
get(obj, prop) {
return prop in obj ? obj[prop] * 2 : 'not found';
},
set(obj, prop, value) {
if (typeof value !== 'number') {
return false;
}
obj[prop] = value + 10;
return true;
}
};
const proxy = new Proxy(target, handler);
proxy.c = '5';
proxy.d = 5;
console.log(JSON.stringify({
a: proxy.a,
b: proxy.b,
c: proxy.c,
d: target.d,
hasC: Reflect.has(target, 'c')
}));
CHALLENGE
function curry(fn) {
return function curried(...args) {
if (args.length >= fn.length) {
return fn.apply(this, args);
}
return function(...moreArgs) {
return curried.apply(this, [...args, ...moreArgs]);
};
};
}
const multiply = curry((a, b, c) => a * b * c);
const double = multiply(2);
const result = double(3)(4);
console.log(result);
I bet some readers have strong feelings about the idea of mixing PHP and Node.js, but this is a neat project. php-node is a native module for Node that enables the running of PHP apps within the Node environment. Why? For migrating legacy apps, building hybrid PHP/JS apps, or Node apps that simply need to call out to PHP for some reason (WordPress, maybe, as we see in this post).
Matteo Collina et al.
Please open Telegram to view this post
VIEW IN TELEGRAM
CHALLENGE
class EventEmitter {
constructor() {
this.events = {};
}
on(event, listener) {
if (!this.events[event]) {
this.events[event] = [];
}
this.events[event].push(listener);
return () => this.off(event, listener);
}
off(event, listener) {
if (!this.events[event]) return;
this.events[event] = this.events[event].filter(l => l !== listener);
}
emit(event, ...args) {
if (!this.events[event]) return false;
this.events[event].forEach(listener => listener(...args));
return true;
}
}
const emitter = new EventEmitter();
const unsubscribe = emitter.on('message', data => console.log(data));
emitter.emit('message', 'Hello');
emitter.emit('message', 'World');
unsubscribe();
emitter.emit('message', 'Ignored');
console.log(emitter.emit('message', 'Still ignored'));
What is the output?
Anonymous Quiz
32%
Hello World false
31%
Hello World true
22%
Hello World Ignored false
15%
Hello World Ignored true
If you’ve ever been overwhelmed by what’s in node_modules, this tool lets you dig around with some guidance as to what is what. You can use fuzzy search to find specific things as well as see which modules are using the most space (you can try it right now with `npx qnm doctor`).
Ran Yitzhaki
Please open Telegram to view this post
VIEW IN TELEGRAM
CHALLENGE
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result = numbers
.filter(num => num % 2 === 0)
.map(num => num * 2)
.reduce((acc, num, index, array) => {
if (index === array.length - 1) {
return (acc + num) / array.length;
}
return acc + num;
}, 0);
console.log(result);
HTML Embed Code: