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
What is the output?
Anonymous Quiz
47%
25 SARAH light disabled
25%
0 SARAH disabled
12%
0 undefined light disabled
16%
25 SARAH light undefined
❤10👍2
CHALLENGE
const obj = {
name: 'Calculator',
values: [1, 2, 3, 4, 5],
regular: function() {
return this.values.filter(function(x) {
return x > 2;
}).length;
},
arrow: function() {
return this.values.filter(x => x > 2).length;
},
broken: () => {
return this.values.filter(x => x > 2).length;
}
};
console.log(obj.regular());
console.log(obj.arrow());
try {
console.log(obj.broken());
} catch(e) {
console.log('Error');
}👍6❤3🔥2
What is the output?
Anonymous Quiz
18%
undefined undefined undefined
28%
Error Error Error
35%
3 3 Error
20%
3 3 3
❤5👍4