CHALLENGE
const obj = { count: 0 };
const arr = [obj, obj, obj];
function increment(item) {
item.count++;
return item;
}
const results = arr.map(increment);
console.log(obj.count);
console.log(results[0] === results[1]);
console.log(results.length);
console.log(arr[0].count);3โค6
โค8๐3๐ค3
Think something like Plausible or Google Analytics, but built in Node and ready for you to host yourself. Hereโs the full feature list. MIT licensed but also available as a paid hosted service.
Umami Software, Inc.
Please open Telegram to view this post
VIEW IN TELEGRAM
โค8๐ฅ1
Created at Pixar in the 80s, the RenderMan Interface Specification was an early API for building 3D scenes. Anders has been building a Node-based, 90s-style renderer for the format โas a stroll down amnesia laneโ in pure JavaScript.
Anders Brownworth
Please open Telegram to view this post
VIEW IN TELEGRAM
โค2๐2๐ฅ2
CHALLENGE
const data = '{"name":"Sarah","age":25,"skills":["JavaScript","Python"]}'
const parsed = JSON.parse(data)
const stringified = JSON.stringify(parsed, null, 0)
const reparsed = JSON.parse(stringified)
try {
const invalid = '{name:"John","incomplete":}'
JSON.parse(invalid)
} catch (e) {
console.log(e.name)
}
console.log(typeof parsed.age)
console.log(reparsed.skills.length)
console.log(JSON.stringify({a: undefined, b: null, c: 0}))โค1
What is the output?
Anonymous Quiz
23%
SyntaxError number 2 {"b":null,"c":0}
48%
TypeError string 2 {"a":undefined,"b":null,"c":0}
23%
SyntaxError number 2 {"a":null,"b":null,"c":0}
6%
ReferenceError number 2 {"b":null,"c":0}
๐คฃ8โค3๐2
๐ฏ๐ต Fancy writing JavaScript in Japanese (above)? Say ใใใซใกใฏ to KokoScript.
๐คฃ7โค5๐2๐ฅ1
CHALLENGE
const user = { name: 'Sarah', age: 28 };
const greeting = 'Hello';
const template = `${greeting}, ${user.name}! You are ${user.age} years old.`;
function createMessage(strings, ...values) {
return strings.reduce((result, string, i) => {
return result + string + (values[i] ? `[${values[i]}]` : '');
}, '');
}
const tagged = createMessage`Welcome ${user.name}, age: ${user.age}!`;
console.log(template);
console.log(tagged);โค3
What is the output?
Anonymous Quiz
41%
Hello, Sarah! You are 28 years old. Welcome Sarah, age: 28!
28%
Hello, Sarah! You are 28 years old. Welcome [Sarah], age: [28]
25%
Hello, Sarah! You are 28 years old. Welcome [Sarah], age: [28]!
6%
Hello, undefined! You are undefined years old. Welcome [Sarah], age: [28]!
โค4๐3
Ever wondered how devtools can magically turn mangled, minified JavaScript back into readable source while debugging? Zero magic; thatโs a source map doing its job. But how do source maps actually work under the hood?
Manoj Vivek
Please open Telegram to view this post
VIEW IN TELEGRAM
โค3๐3๐ฅ1
CHALLENGE
const wm = new WeakMap();
const obj1 = { name: 'first' };
const obj2 = { name: 'second' };
wm.set(obj1, 'value1');
wm.set(obj2, 'value2');
const keys = [];
for (let key of wm) {
keys.push(key);
}
console.log(keys.length);
console.log(wm.has(obj1));
console.log(wm.get(obj2));
What is the output?
Anonymous Quiz
21%
TypeError: wm is not iterable
59%
2 true value2
12%
undefined false undefined
7%
0 true value2
๐คฃ4โค1๐1
CascadiaJS took place a month ago and the talk videos have been gradually rolling out onto YouTube. You can learn more about TanStack with Jack Herrington, the origin story of JavaScript with Annie Sexton, the Web Monetization API with Ioana Chiorean, and more.
CascadiaJS
Please open Telegram to view this post
VIEW IN TELEGRAM
๐3โค1๐ฅ1
CHALLENGE
const target = { name: 'Sarah', age: 25 };
const handler = {
get(obj, prop) {
if (prop === 'info') {
return `${obj.name} is ${obj.age}`;
}
return Reflect.get(obj, prop);
},
has(obj, prop) {
return prop !== 'age' && Reflect.has(obj, prop);
}
};
const proxy = new Proxy(target, handler);
console.log(proxy.info);
console.log('age' in proxy);
console.log('name' in proxy);What is the output?
Anonymous Quiz
31%
Sarah is 25, true, false
43%
Sarah is 25, false, true
18%
undefined, false, true
7%
Sarah is 25, false, false
โค2๐ค2๐1
Originally built by JP Morgan, this data visualization component, built in C++ and compiled to WebAssembly, is well-suited for large and real-time streaming datasets. The demo on the homepage lets you try visualization types at up to 1000 changes per second. v4.0 sees the project move to the OpenJS Foundation.
OpenJS Foundation
Please open Telegram to view this post
VIEW IN TELEGRAM
โค1๐1๐ฅ1