Dr. Axel asks us to imagine if we had to write JavaScript without any whitespace or comments, so why should we have to write regexes that way? He has some tips for making the process more pleasant.
Dr. Axel Rauschmayer
Please open Telegram to view this post
VIEW IN TELEGRAM
β€7π€3π₯2π1
CHALLENGE
const cache = new WeakMap();
const user1 = { name: 'Alice' };
const user2 = { name: 'Bob' };
cache.set(user1, { lastLogin: 'yesterday' });
cache.set(user2, { lastLogin: 'today' });
const result = [];
result.push(cache.has(user1));
result.push(cache.get(user2).lastLogin);
let user3 = { name: 'Charlie' };
cache.set(user3, { lastLogin: 'now' });
result.push(cache.has(user3));
user3 = null; // Removing the reference
// Garbage collector might run here in real situations
const user4 = { name: 'Charlie' }; // Same name, different object
result.push(cache.has(user4));
console.log(result);
β€5
What is the output?
Anonymous Quiz
24%
[false, 'today', true, false]
40%
[true, 'today', true, false]
17%
[true, undefined, true, false]
19%
[true, 'today', true, true]
π9π₯3β€1
CHALLENGE
const items = ['apple', 'banana', 'cherry', 'date'];
const result = items
.map(item => item.toUpperCase())
.filter(item => item.length > 5)
.reduce((acc, item, index) => {
return acc + (index === 0 ? '' : '-') + item.slice(0, 3);
}, '');
console.log(result);
β€2π₯1
What is the output?
Anonymous Quiz
27%
BANANA-CHERRY-DATE
44%
BAN-CHE
21%
BANANA-CHERRY
8%
BAN-CHE-DAT
π₯9π€2β€1
Hono is a framework well worth exploring. Itβs fast, lightweight, built on Web Standards, and can be used to build apps that work on numerous platforms from Node or Bun to Cloudflare or Fastly. v4.8 adds new route helper functions, improvements to JSX streaming and CORS, a new plugin system for static site generation, and more.
Yusuke Wada and Contributors
Please open Telegram to view this post
VIEW IN TELEGRAM
β€7π1π₯1
CHALLENGE
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
const result = numbers
.filter(n => n % 2 === 0)
.map(n => n * 2)
.reduce((acc, curr, idx, arr) => {
if (idx === arr.length - 1) {
return (acc + curr) / arr.length;
}
return acc + curr;
}, 0);
console.log(result);
β€2π₯2π€2
π€8π€£3β€2π₯1
CHALLENGE
const teams = [
{ name: 'Warriors', players: ['Curry', 'Thompson'] },
{ name: 'Lakers', players: ['James', 'Davis'] }
];
const newTeams = JSON.parse(JSON.stringify(teams));
newTeams[0].players.push('Green');
const shallowCopy = [...teams];
shallowCopy[1].name = 'Clippers';
const freezeTest = Object.freeze({nested: {value: 42}});
freezeTest.nested.value = 100;
console.log(teams[1].name, teams[0].players.length, freezeTest.nested.value);
β€6π€£4
What is the output?
Anonymous Quiz
42%
Clippers 2 100
25%
Lakers 2 100
22%
Lakers 3 42
11%
Clippers 3 100
β€3π3π₯3
CHALLENGE
let x = 5;
function foo() {
console.log(x);
let x = 10;
console.log(x);
}
foo();
β€1
What is the output?
Anonymous Quiz
25%
ReferenceError: Cannot access 'x' before initialization
25%
undefined 10
14%
5 ReferenceError: x is not defined
35%
5 10
β€8π4π€£3π₯2
Deno 2.4 reintroduces the deno bundle command for creating single-file bundles for both the server and client side, complete with support for npm and JSR dependencies and automatic tree-shaking. You can also now include arbitrary files into modules using import, and Denoβs built-in OpenTelemetry support is now stable. Itβs a substantial release.
IwaΕczuk and Jiang
Please open Telegram to view this post
VIEW IN TELEGRAM
β€3π2π₯1
CHALLENGE
const fruits = ['apple', 'banana', 'cherry'];
const newFruits = [...fruits];
newFruits.push('date');
const user = { name: 'Taylor', age: 30 };
const updatedUser = { ...user, age: 31 };
user.city = 'Seattle';
console.log(fruits.length, newFruits.length, user.city, updatedUser.city);
β€4
What is the output?
Anonymous Quiz
23%
3 4 undefined undefined
22%
3 3 Seattle undefined
44%
3 4 Seattle undefined
11%
4 4 Seattle Seattle
CHALLENGE
const handler = {
get(target, prop) {
if (prop in target) {
return target[prop] * 2;
} else {
return `Property ${prop} not found`;
}
},
set(target, prop, value) {
if (typeof value === 'number') {
target[prop] = Math.round(value);
return true;
}
return false;
}
};
const obj = { a: 5, b: 10 };
const proxy = new Proxy(obj, handler);
proxy.c = 7.8;
proxy.d = "hello";
console.log(obj.c, proxy.a, proxy.x);
β€2
What is the output?
Anonymous Quiz
28%
8 10 "Property x not found"
25%
8 10 undefined
31%
8 10 Property x not found
16%
7.8 10 Property x not found
π€5β€3π1
A straightforward, practical look at bringing together several technologies and skills to create an AI powered color suggestion tool (which you can try here β results may vary, as seen above). The techniques covered can be used for many different practical ends.
LΓΊΓ Smyth
Please open Telegram to view this post
VIEW IN TELEGRAM
π₯6β€2π2
CHALLENGE
const map = new WeakMap();
let obj1 = { name: 'user1' };
let obj2 = { name: 'user2' };
map.set(obj1, 'data for user1');
map.set(obj2, 'data for user2');
console.log(map.has(obj1));
obj1 = null;
// After garbage collection runs
console.log(map.has(obj1));
console.log(map.get(obj2));
What is the output?
Anonymous Quiz
24%
true ReferenceError: obj1 is not defined
43%
true false data for user2
15%
true false undefined
18%
true false 'data for user2'
β€3π₯2π1
A WYSIWYG Markdown editor framework based around a plugin system that enables a significant level of customization. The docs are rendered by Milkdown itself and thereβs a neat βplaygroundβ experience to try as well. GitHub repo.
Mirone
Please open Telegram to view this post
VIEW IN TELEGRAM
β€2π₯2π1