JavaScript
31.9K subscribers
1.01K photos
9 videos
33 files
691 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

function processData(data) {
try {
if (!data) {
throw new TypeError('Data is missing');
}

const result = data.process();
return result;
} catch (error) {
console.log(error instanceof ReferenceError ? 1 :
error instanceof TypeError ? 2 :
error instanceof SyntaxError ? 3 : 4);
}
}

processData(null);
πŸ‘4❀2
What is the output?
Anonymous Quiz
18%
1
43%
2
34%
undefined
5%
4
❀5πŸ‘4πŸ”₯3πŸ€”1
Please open Telegram to view this post
VIEW IN TELEGRAM
πŸ‘5πŸ€”4πŸ”₯3❀1
🀩 pnpm 10.14: Adds Support for JavaScript Runtime Installation

The popular, efficiency-focused package installer now lets you define Node.js, Deno or Bun versions in package.json and pnpm will then download and pin them automatically.

Zoltan Kochan
Please open Telegram to view this post
VIEW IN TELEGRAM
❀7πŸ‘4πŸ”₯1
CHALLENGE

const obj = {
name: 'Sarah',
getName() {
return this.name;
},
getNameArrow: () => {
return this.name;
}
};

const getName = obj.getName;
const getNameArrow = obj.getNameArrow;

console.log(obj.getName());
console.log(getName());
console.log(getNameArrow());
console.log(obj.getNameArrow());
🀩2❀1πŸ€”1
⚑️DevHelperAI β€” AI Assistant for Programmers

Speed up solving programming tasks in any language β€” Python, JavaScript, Java, and more. Powered by ChatGPT Plus, but 3Γ— cheaper! Don’t overpay $20 for ChatGPT Plus β€” pay just $7.25 and get faster, more accurate answers. Try DevHelperAI now! πŸ‘‡
First month FREE !

@devhelperai_bot
Please open Telegram to view this post
VIEW IN TELEGRAM
❀10πŸ‘4πŸ”₯1
CHALLENGE

const target = { name: 'Maya', age: 25 };
const handler = {
get(obj, prop) {
if (prop in obj) {
return obj[prop];
}
return `Property '${prop}' not found`;
},
set(obj, prop, value) {
if (typeof value === 'string') {
obj[prop] = value.toUpperCase();
} else {
obj[prop] = value;
}
return true;
}
};
const proxy = new Proxy(target, handler);
proxy.city = 'tokyo';
console.log(proxy.name);
console.log(proxy.city);
console.log(proxy.country);
❀4
πŸ₯Ά Announcing TypeScript 5.9

One of TypeScript's gentlest steps forward, with support for import defer, --module node20, and β€˜expandable hovers’ (below) to see expanded type information in IDEs. We also learn v6.0 will act as a β€˜transition point’ to get prepared for the Go-powered β€˜native port’ of TypeScript due to arrive as TypeScript 7.0.

Microsoft
Please open Telegram to view this post
VIEW IN TELEGRAM
❀6πŸ‘1πŸ”₯1
CHALLENGE

const numbers = [1, 2, 3, 4, 5];

const result = numbers
.map(x => x * 2)
.filter(x => x > 5)
.reduce((acc, x) => {
acc.push(x.toString());
return acc;
}, [])
.map(x => x + '!')
.join(' | ');

console.log(result);
console.log(typeof result);
4πŸ‘5❀4
❀9πŸ‘2πŸ”₯1
🚬 Apache ECharts 6.0: The Powerful Data Visualization Library

12 years on from its first release, ECharts takes another big step forward. Visualization types span from line, bar and pie charts to 3D graphs, calendars and Sankey diagrams. v6 brings an all-new design language, dynamic theme switching, dark mode support, even more chart types, and more. Be sure to enjoy the 100+ demos and the GitHub repo.

Apache Software Foundation
Please open Telegram to view this post
VIEW IN TELEGRAM
❀5πŸ‘1πŸ”₯1
CHALLENGE

const data = {
name: '',
age: 0,
city: null,
country: undefined,
isActive: false
};

const getName = () => data.name || 'Unknown';
const getAge = () => data.age ?? 25;
const getCity = () => data.city || 'Default City';
const getCountry = () => data.country ?? 'Default Country';
const getStatus = () => data.isActive || 'inactive';

console.log(`${getName()}-${getAge()}-${getCity()}-${getCountry()}-${getStatus()}`);
❀3
CHALLENGE

const sym1 = Symbol('test');
const sym2 = Symbol('test');
const obj = {
[sym1]: 'first',
[sym2]: 'second',
regular: 'third'
};

const keys = Object.keys(obj);
const symbols = Object.getOwnPropertySymbols(obj);
const allProps = Reflect.ownKeys(obj);

console.log(keys.length);
console.log(symbols.length);
console.log(allProps.length);
console.log(sym1 === sym2);
πŸ”₯3❀2
❀4πŸ‘2πŸ”₯1
Interesting idea πŸ€”

I always thought that front-end development is much harder then backend, but I was having trouble to explain that idea to developers. Today I wanted to check the opinion of the LLM, so called the general expert's opinion.

Agreed that front-end is harder for humans, because backend scales mathematically, rule based, and it's not that hard to understand. It's just math...

Then I asked, to find a similar analogy for front-end. It nailed. BIOLOGY!
____
Backend scaling: like mathematics: you add more nodes, shard databases, optimize queries - the system grows by formulas and predictable rules.

Frontend change: like biology: small mutations (new device, new browser feature, new UX demand) create emergent, often chaotic behavior that must be adapted to case by case.
____
Biology is more difficult then mathematics β€” mathematics is rule-bound and deterministic, while biology is emergent, full of exceptions, context-dependent, and constantly changing.
That’s why front-end (biology-like) feels messier and harder for humans, even if backend (math-like) can be more abstractly deep.

Edgar Marukyan
πŸ€”11πŸ‘7❀2
CHALLENGE

const values = [null, undefined, '', 0, false, NaN];
const results = [];

for (let val of values) {
results.push({
value: val,
boolean: !!val,
string: String(val),
number: Number(val)
});
}

console.log(results[2].boolean);
console.log(results[3].string);
console.log(results[1].number);
❀3πŸ‘2
❀3πŸ‘2πŸ”₯1