JavaScript
31.9K subscribers
1.02K photos
9 videos
33 files
698 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 original = { a: 1, b: { c: 2 } };
const shallow = { ...original };
const deep = JSON.parse(JSON.stringify(original));

shallow.a = 10;
shallow.b.c = 20;

deep.a = 100;
deep.b.c = 200;

const frozen = Object.freeze({ x: 1, y: { z: 2 } });
frozen.x = 99;
frozen.y.z = 99;

console.log(original.a, original.b.c, frozen.x, frozen.y.z);
❀2πŸ”₯2
❀4πŸ‘2
Please open Telegram to view this post
VIEW IN TELEGRAM
❀4πŸ‘2πŸ”₯2πŸ€”2
CHALLENGE

async function fetchData() {
console.log('1');
return Promise.resolve('data');
}

async function processData() {
console.log('2');
const result = await fetchData();
console.log('3');
return result;
}

console.log('4');
processData().then(() => console.log('5'));
console.log('6');
❀6πŸ€”3πŸ‘2
πŸ‘‘ Cronicle: Cron with a Web Front End

Describing itself as β€˜a fancy cron replacement’, Cronicle is a distributed task scheduler and runner, built around a Node app with a web based UI. GitHub repo.

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

const arr = new Array(1000000).fill(0).map((_, i) => i);
const results = [];

function method1() {
return arr.filter(x => x % 2 === 0).map(x => x * 2).slice(0, 3);
}

function method2() {
const result = [];
for (let i = 0; i < arr.length && result.length < 3; i++) {
if (arr[i] % 2 === 0) {
result.push(arr[i] * 2);
}
}
return result;
}

console.log(method1().join(','));
console.log(method2().join(','));
What is the output?
Anonymous Quiz
13%
0,2,4
58%
0,4,8 0,4,8
19%
2,4,6
10%
0,4,8
❀1πŸ‘1πŸ”₯1
😈 Sam Rose has put together a fantastic illustrated introduction to Big O notation, along with JavaScript examples. If you've ever wondered what O(1), O(log n), etc. mean, this is a great primer.
Please open Telegram to view this post
VIEW IN TELEGRAM
❀8πŸ‘4πŸ”₯1
CHALLENGE

const obj = { a: 1, b: { c: 2 } };
const frozen = Object.freeze(obj);
frozen.a = 99;
frozen.b.c = 88;
frozen.d = 77;

const sealed = Object.seal({ x: 10, y: 20 });
sealed.x = 30;
sealed.z = 40;
delete sealed.y;

console.log(obj.a, obj.b.c, obj.d);
console.log(sealed.x, sealed.y, sealed.z);
CHALLENGE

class StateMachine {
constructor() {
this.state = 'idle';
this.transitions = {
idle: { start: 'running' },
running: { pause: 'paused', stop: 'idle' },
paused: { resume: 'running', stop: 'idle' }
};
}

transition(action) {
const validTransitions = this.transitions[this.state];
if (validTransitions && validTransitions[action]) {
this.state = validTransitions[action];
return true;
}
return false;
}
}

const machine = new StateMachine();
console.log(machine.transition('pause'));
console.log(machine.state);
console.log(machine.transition('start'));
console.log(machine.state);
πŸ‘1
CHALLENGE

const userInput = "<script>alert('xss')</script>";
const sanitized = userInput.replace(/<script[^>]*>.*?<\/script>/gi, '');

const users = new Map();
users.set('admin', { password: 'secret123', role: 'admin' });
users.set('guest', { password: 'guest', role: 'user' });

function authenticate(username, password) {
const user = users.get(username);
return user && user.password === password ? user.role : null;
}

const role1 = authenticate('admin', 'secret123');
const role2 = authenticate('guest', 'wrong');
const role3 = authenticate('hacker', 'secret123');

console.log(sanitized);
console.log(role1, role2, role3);
❀4πŸ‘3
πŸ“Έ The Hidden Costs of Angular Updates.

πŸ“… September 3, 4 PM UTC
πŸŽ™ Host: Armen Vardanyan
🎀 Guest: Gérôme Grignon

We’ll cover:
- What ng update does well
- Where the hidden costs appear in real projects
- Refactoring & dependency pitfalls
- How upgrades affect teams & long-term maintainability

Check the Linkedin post to learn more.
Please open Telegram to view this post
VIEW IN TELEGRAM
❀4πŸ‘2πŸ”₯1