JavaScript
31.6K subscribers
1.17K photos
10 videos
33 files
843 links
A resourceful newsletter featuring the latest and most important news, articles, books and updates in the world of #javascript ๐Ÿš€ Don't miss our Quizzes!

Let's chat: @nairihar
Download Telegram
CHALLENGE


const config = {
version: 1,
settings: { theme: "dark", fontSize: 14 },
tags: ["beta", "v1"],
};

Object.seal(config);
Object.freeze(config.settings);

config.version = 99;
config.newProp = "ignored";
delete config.tags;

config.settings.theme = "light";
config.settings.newKey = "ignored";

config.tags.push("v2");
config.tags[0] = "stable";

console.log(
config.version,
config.newProp,
config.settings.theme,
config.tags
);
๐Ÿ”ฅ4๐Ÿ‘1
CHALLENGE


"use strict";

function createCounter() {
let count = 0;

return {
increment() { count++; },
get value() { return count; },
reset: function() { count = 0; }
};
}

const counter = createCounter();
counter.increment();
counter.increment();
counter.increment();

const { value, reset } = counter;
reset();

console.log(counter.value, value);
โค4๐Ÿ”ฅ2
๐Ÿ”ฅ5๐Ÿ‘2
CHALLENGE


const delay = (val) => Promise.resolve(val);

async function pipeline(input) {
const result = await delay(input)
.then((v) => v * 2)
.then((v) => v + 10)
.then((v) => {
if (v > 20) throw new Error(`Too large: ${v}`);
return v;
})
.catch((e) => `Caught: ${e.message}`)
.then((v) => (typeof v === "string" ? v.toUpperCase() : v * 3));

return result;
}

Promise.all([pipeline(4), pipeline(8)]).then(([a, b]) => {
console.log(a);
console.log(b);
});
โค2๐Ÿ‘1
๐ŸŒฒ Node Moves to Enable Temporal By Default

The Temporal API, designed to modernize JavaScriptโ€™s date/time handling, reached stage 4 last month. Node was waiting on V8 to make it enabled by default, which happened in V8 14.4, and the wheels are now in motion for an eventual release in Node 26.

Richard Lau
Please open Telegram to view this post
VIEW IN TELEGRAM
โค7๐Ÿ‘7๐Ÿ”ฅ1
CHALLENGE


const handler = {
get(target, prop, receiver) {
if (prop in target) {
return Reflect.get(target, prop, receiver) * 2;
}
return `${prop} not found`;
},
set(target, prop, value) {
if (typeof value !== "number") {
throw new TypeError("Only numbers allowed");
}
target[prop] = value + 10;
return true;
},
has(target, prop) {
return prop.startsWith("x") ? false : prop in target;
},
};

const obj = new Proxy({ score: 5, xp: 100 }, handler);

obj.level = 3;
console.log(obj.score);
console.log(obj.level);
console.log("xp" in obj);
console.log("score" in obj);
console.log(obj.rank);
โค2๐Ÿ‘1๐Ÿ”ฅ1
๐Ÿ‘€ FluidCAD (above) is a new project bringing parametric CAD to the JavaScript world where you can write code to create/manipulate objects and see a live update of what you're making. It's built on top of OpenCascade.js, a JS/WASM port of the open source OpenCascade 3D geometry library.
Please open Telegram to view this post
VIEW IN TELEGRAM
โค10๐Ÿ‘5๐Ÿ”ฅ3
CHALLENGE

const curry = (fn) => {
const arity = fn.length;
return function curried(...args) {
if (args.length >= arity) {
return fn(...args);
}
return (...moreArgs) => curried(...args, ...moreArgs);
};
};

const volume = (l, w, h) => l * w * h;
const curriedVolume = curry(volume);

const withLength5 = curriedVolume(5);
const withLength5Width3 = withLength5(3);

console.log(typeof withLength5);
console.log(typeof withLength5Width3);
console.log(withLength5Width3(2));
console.log(curriedVolume(4)(6)(2));
๐Ÿ‘3๐Ÿ”ฅ3โค1
โค4๐Ÿ‘3๐Ÿ”ฅ2
CHALLENGE


function checkTDZ() {
console.log(typeof undeclaredVar);

try {
console.log(typeof letVar);
} catch (e) {
console.log(`Caught: ${e.constructor.name}`);
}

let letVar = "initialized";

const result = (() => {
let x = 10;
return function () {
let x = x + 5;
return x;
};
})();

try {
console.log(result());
} catch (e) {
console.log(`Caught: ${e.constructor.name}`);
}
}

checkTDZ();
โค1๐Ÿ‘1๐Ÿ”ฅ1
CHALLENGE


const str = " Hello, World! ";

const result = str
.trim()
.split(", ")
.map((word, i) => {
return i === 0
? word.toUpperCase()
: word.replace(/!$/, "").split("").reverse().join("") + "?";
})
.join(" | ");

const [first, ...rest] = result.split(" | ");
const final = `${first} | ${rest.join(" & ")}`;

console.log(final);
โค1๐Ÿ”ฅ1
๐Ÿ‘3โค2
CHALLENGE


const p1 = new Promise((resolve) => {
console.log("A");
resolve("B");
});

const p2 = p1.then((val) => {
console.log(val);
return "C";
});

p2.then((val) => {
console.log(val);
});

console.log("D");
๐Ÿ”ฅ1
โค2๐Ÿ‘2๐Ÿ”ฅ1
๐Ÿ˜ฎ Under the Hood of MDN's New Frontend

The hugely useful MDN has rebuilt its frontend stack from the ground up, ditching React for web components and a homegrown server component system. A great read on building a modern, content-heavy site without shipping unnecessary JavaScript on every page.

Leo McArdle (MDN)
Please open Telegram to view this post
VIEW IN TELEGRAM
โค9๐Ÿ”ฅ2๐Ÿ‘1