What is the output?
Anonymous Quiz
18%
3 a,b,c 6 [ 'a', 1 ]
35%
3 a-b-c 6 [ 'a', 1 ]
37%
3 'a-b-c' 6 [ 'a', 1 ]
10%
3 a-b-c 6 ['a', 1]
👍8🤔4❤3🤣2🔥1
At the start of each year, Michael rounds up the projects in the JavaScript ecosystem that gained the most popularity on GitHub in the prior year. After a two-year run of topping the chart, shadcn/ui has been pushed down to #3 by n8n and React Bits. This is a fantastic roundup, now in its tenth(!) year, and features commentary from a few industry experts too.
Michael Rambeau et al.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6👍3🔥3
CHALLENGE
const config = { api: 'v1', timeout: 5000 };
Object.seal(config);
const settings = { theme: 'dark', lang: 'en' };
Object.freeze(settings);
config.api = 'v2';
config.retries = 3;
settings.theme = 'light';
settings.debug = true;
console.log(config.api);
console.log(config.retries);
console.log(settings.theme);
console.log(settings.debug);👍4🔥2
What is the output?
Anonymous Quiz
40%
v2 undefined dark undefined
29%
v1 undefined light true
22%
v2 3 dark undefined
10%
v1 3 light true
👍5🔥3❤2
Available in the form of React/Preact, Vue, Svelte, Angular, or plain JS components. Open source but with a premium version with extra features. GitHub repo.
Tom Österlund
Please open Telegram to view this post
VIEW IN TELEGRAM
❤8🔥3👍1
CHALLENGE
console.log(typeof myVar);
console.log(typeof myFunc);
console.log(typeof myArrow);
var myVar = 'initialized';
function myFunc() {
return 'function declaration';
}
var myArrow = () => 'arrow function';
console.log(typeof myVar);
console.log(typeof myFunc);
console.log(typeof myArrow);
❤3👍2🔥1
Please open Telegram to view this post
VIEW IN TELEGRAM
❤5👍3🔥3
CHALLENGE
const data = [
{ type: 'income', amount: 1000, category: 'salary' },
{ type: 'expense', amount: 200, category: 'food' },
{ type: 'income', amount: 500, category: 'freelance' },
{ type: 'expense', amount: 150, category: 'transport' }
];
const result = data.reduce((acc, item) => {
const key = item.type;
acc[key] = (acc[key] || 0) + item.amount;
return acc;
}, {});
console.log(result.income - result.expense);
👍4❤3🔥1
🔥6❤5👍1
CHALLENGE
async function processData() {
const promise1 = Promise.resolve('first');
const promise2 = Promise.reject('error');
const promise3 = Promise.resolve('third');
try {
const result = await Promise.allSettled([promise1, promise2, promise3]);
console.log(result[0].status);
console.log(result[1].reason);
console.log(result[2].value);
} catch (error) {
console.log('caught:', error);
}
}
processData();❤8🔥2
What is the output?
Anonymous Quiz
35%
fulfilled error third
30%
caught: error
20%
first error third
14%
fulfilled undefined third
❤4👍3🔥3
CHALLENGE
function highlight(strings, ...values) {
return strings.reduce((result, str, i) => {
const value = values[i] ? `<em>${values[i]}</em>` : '';
return result + str + value;
}, '');
}
const name = 'Sarah';
const score = 95;
const message = highlight`Hello ${name}, your score is ${score}!`;
console.log(message);🔥4👍2
CHALLENGE
class Counter {
#value = 0;
get count() {
console.log('Getting count');
return this.#value;
}
set count(val) {
console.log('Setting count to', val);
this.#value = Math.max(0, val);
}
}
const counter = new Counter();
counter.count = -5;
console.log(counter.count);👍4❤3🔥2
What is the output?
Anonymous Quiz
24%
Setting count to -5 Getting count -5
26%
Getting count Setting count to -5 -5
19%
Getting count Setting count to -5 0
30%
Setting count to -5 Getting count 0
🔥4❤3👍3
CHALLENGE
const pipe = (...fns) => (value) => fns.reduce((acc, fn) => fn(acc), value);
const add = (x) => (y) => x + y;
const multiply = (x) => (y) => x * y;
const subtract = (x) => (y) => y - x;
const transform = pipe(
add(5),
multiply(3),
subtract(2)
);
console.log(transform(4));
console.log(transform(0));
🔥6👍3❤2
🔥7❤5👍2
Lea, who has worked at the heart of Web Standards for years, delivers a compelling (and educational) call to action about a problem every JavaScript developer has encountered: why is managing dependencies and introducing them into code so unnecessarily messy and what could we do about it?
Lea Verou
Please open Telegram to view this post
VIEW IN TELEGRAM
❤7👍5
CHALLENGE
const user = { name: 'Sarah', age: 0 };
const config = { theme: '', debug: false };
const result1 = user.age || 25;
const result2 = user.name && user.name.toUpperCase();
const result3 = config.theme || 'light';
const result4 = config.debug && console.log('Debug mode') || 'disabled';
console.log(result1);
console.log(result2);
console.log(result3);
console.log(result4);👍6❤4🔥3🤔3