1// JS Tip of the Day
2// Get the last item in an array (reloaded)
3
4const heroes = ['Batman', 'Superman', 'Wonder Woman'];
5// Use Array length
6console.log(heroes[heroes.length - 1]); // ['Wonder Woman']
7// Array.prototype.slice method
8console.log(heroes.slice(-1)[0]); // ['Wonder Woman']
9// Array.prototype.pop method
10console.log([...heroes].pop()); // ['Wonder Woman']
11/*
12  Array.prototype.at new method
13  but check the browser compatibility (Chrome 92 / Firefox 90)!
14*/
15console.log(heroes.at(-1)); 

1// JS Tip of the Day
2// Different methods to manage the immutability of the objects
3
4// Object.preventExtensions
5const heroPreventExt = { name: 'Batman', weapon: 'Batarang' };
6Object.preventExtensions(heroPreventExt);
7heroPreventExt.weapon = 'Grapple Gun'; // Allowed!
8Object.defineProperty( heroPreventExt, 'weapon', { 
9    writable: false,
10});
11delete heroPreventExt.weapon; // Allowed!
12heroPreventExt.vehicle = 'Batmobile'; // Not Allowed!
13console.log(heroPreventExt.vehicle); 
14/* undefined 
15   or in Strict Mode
16   TypeError: Cannot add property vehicle, object is not extensible
17*/ 
18Object.isExtensible(heroPreventExt) //false
19
20
21// Object.seal
22const heroSeal = { name: 'Batman', weapon: 'Batarang' };
23Object.seal(heroSeal);
24heroSeal.weapon = 'Grapple Gun'; // Allowed!
25Object.defineProperty( heroSeal, 'weapon', { 
26    writable: false,
27}); // Not Allowed!
28delete heroSeal.weapon; // Not Allowed!
29/* false 
30   or in Strict Mode
31   TypeError: Cannot delete property 'weapon' of #<Object>
32*/
33heroSeal.vehicle = 'Batmobile'; // Not Allowed!
34console.log(heroSeal.vehicle); 
35/* undefined 
36   or in Strict Mode
37   TypeError: Cannot add property vehicle, object is not extensible
38*/ 
39Object.isSealed(heroSeal) // true
40
41
42// Object.freeze
43const heroFreeze = { name: 'Batman', weapon: 'Batarang' };
44Object.freeze(heroFreeze);
45heroFreeze.weapon = 'Grapple Gun'; // Allowed!
46/* 
47  In Strict Mode
48  TypeError: Cannot assign to read only property 'weapon' of object '#<Object>'
49*/
50Object.defineProperty( heroFreeze, 'weapon', { 
51    writable: false,
52}); // Not Allowed!
53delete heroFreeze.weapon;
54/* undefined 
55   or in Strict Mode
56   TypeError: Cannot add property vehicle, object is not extensible
57*/ 
58heroFreeze.vehicle = 'Batmobile'; // Not Allowed!
59console.log(heroFreeze.vehicle); 
60/* undefined 
61   or in Strict Mode
62   TypeError: Cannot add property vehicle, object is not extensible
63*/ 
64Object.isFrozen(heroFreeze) // true

1// JS Tip of the Day
2// How to get the number of unique characters in a string
3
4const hero = "I'm the night!";
5
6// Case sensitive
7console.log(new Set(hero).size); // 11
8
9// Case insensitive
10console.log(new Set(hero.toLowerCase()).size); // 10

1// JS Tip of the Day
2// Get the computed live collection of an Element CSS properties
3
4/*
5  a {
6    font-size: 16px;
7  }
8	
9  #hero > a {
10  	text-decoration: none;
11    font-size: 2em;
12  }
13
14  #hero > a:hover {
15  	text-decoration: underline;
16  }
17*/
18
19let heroLink = document.querySelector('#hero > a');
20let heroStyle = getComputedStyle(heroLink);
21console.log(heroStyle.textDecoration, heroStyle.fontSize);
22// none solid rgb(27, 27, 27) 16px
23
24heroLink.addEventListener('mouseover', function() {
25  console.log(heroStyle.textDecoration, heroStyle.fontSize);
26  // underline solid rgb(27, 27, 27) 78.112px
27});

1// JS Tip of the Day
2// Intl API Examples
3
4const number = 789123.456;
5
6// Number format
7Intl.NumberFormat("en-US").format(number); 
8// 789,123.456
9Intl.NumberFormat("it-IT").format(number); 
10// 789.123,456
11
12// Currency format
13new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(number);
14// $789,123.46
15new Intl.NumberFormat('it-IT', { style: 'currency', currency: 'EUR' }).format(number);
16// €789.123,46
17
18// Unit format
19const literConfig = {style: 'unit', unit: 'liter'};
20new Intl.NumberFormat('en-US', literConfig).format(number);
21// 789.123,46 L
22new Intl.NumberFormat('en-US', {...literConfig, unitDisplay: 'long'}).format(number);
23// 789.123,46 liters
24new Intl.NumberFormat('it-IT', literConfig).format(number);
25// 789.123,46 l
26new Intl.NumberFormat('it-IT', {...literConfig, unitDisplay: 'long'}).format(number);
27// 789.123,46 litri
28
29const meterConfig = {style: 'unit', unit: 'meter-per-second'};
30new Intl.NumberFormat('en-US', meterConfig).format(number);
31// 789.123,456 m/s"
32new Intl.NumberFormat('en-US', {...meterConfig, unitDisplay: 'long'}).format(number);
33// 789.123,456 meters per second
34new Intl.NumberFormat('it-IT', meterConfig).format(number);
35// 789.123,456 m/s"
36new Intl.NumberFormat('it-IT', {...meterConfig, unitDisplay: 'long'}).format(number);
37// 789.123,456 metri per secondo