Tip of the day - JavaScript

Un trucchetto al giorno per mantenerti allenato o per conoscere qualcosa di nuovo sul magico mondo di JavaScript.

43

How to force to execute a function like a constructor

2021-03-24 - JavaScript

1// JS Tip of the Day
2// How to force to execute a function like a constructor
3
4function Hero(name) {
5  // new.target is true if called by the new operator
6  if (!new.target) { 
7    return new Hero(name);
8  }
9
10  this.name = name;
11}
12
13let bestHero = Hero('Batman');
#JStipoftheday
42

Exit nested loops (but avoid nesting loop!)

2021-03-23 - JavaScript

1// JS Tip of the Day
2// Exit nested loops (but avoid nesting loop!)
3
4outerLoop:
5for(let outerIndex = 0; outerIndex < 10; outerIndex++) {
6  innerLoop:
7  for(innerIndex = 0; innerIndex < 10; innerIndex++) {
8	if(outerIndex === 2 && innerIndex === 5) {
9     	break outerLoop; 
10    }
11    console.log(outerIndex, innerIndex);
12  }
13}
#JStipoftheday
41

One-line Arrow Function with undefined returns only

2021-03-22 - JavaScript

1// JS Tip of the Day
2// One-line Arrow Function with undefined returns only
3
4const getHero = () => 'Batman';
5const getUndefinedHero = () => void 'Batman';
#JStipoftheday
40

Logical assignment operators

2021-03-19 - JavaScript

1// JS Tip of the Day
2// Logical assignment operators
3
4let hero = 'Batman';
5let newHero = 'Superman';
6
7/*
8 &&= operator is equivalent of: 
9 	if (hero) { hero = newHero; }
10  or 
11  	hero && (hero = newHero);
12*/
13hero &&= newHero; 
14
15/*
16 ||= operator is equivalent of: 
17 	if (!hero) { hero = newHero; }
18  or 
19  	hero || (hero = newHero);
20*/
21hero ||= newHero; 
22
23/*
24 ??= operator is equivalent of: 
25 	if (hero === null) { hero = newHero; }
26  or 
27  	hero ?? (hero = newHero);
28    
29 ?? operator understands nullish values, and will not work for values that are falsy.    
30*/
31hero ??= newHero;
#JStipoftheday
39

How to trigger events (Destructuring Edition :D)

2021-03-18 - JavaScript

1// JS Tip of the Day
2// How to trigger events (Destructuring Edition :D)
3
4const el = document.querySelector('.example-class');
5
6const defParams = { hero: 'An Hero' };
7// Add an event listener to an element
8el.addEventListener('click', ({ detail: { hero } = defParams }) => {
9  console.log(`${hero} clicked me!`); 
10});
11
12el.dispatchEvent(new Event('click')); 
13// An hero clicked me!
14el.dispatchEvent(new CustomEvent('click', { detail: { hero: 'Batman' } })); 
15// Batman clicked me
#JStipoftheday

Preferisci ricevere i tips via mail? Iscriviti alla newsletter.

Iscriviti alla newsletter

Tip of the day - JavaScript

Hai in mente un progetto e vorresti realizzarlo?
Sei interessato a migliorare le tue competenze o quelle del tuo team in ambito di programmazione e sviluppo?

Anche se - semplicemente - vuoi prendere un caffè con noi o vedere la nostra collezione di Action Figures scrivici tramite questo form.

Questo sito è protetto da reCAPTCHA e si applicano le Norme sulla privacy e i Termini di servizio di Google.