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

1// JS Tip of the Day
2// Simple Zip Function
3
4const zip = (firstArray, secondArray) => {
5  const zipped = [];
6  for (let i = 0; i < Math.min(firstArray.length, secondArray.length); i++) {
7    zipped.push([firstArray[i], secondArray[i]]);
8  }
9  return zipped;
10};
11
12const zippedHeroes = zip(
13  ['Batman', 'Superman', 'Wonder Woman', 'Flash'],
14  ['Robin', 'Superboy', 'Donna Troy']
15);
16
17console.log(zippedHeroes);
18// [['Batman', 'Robin'], ['Superman', 'Superboy'], ['Wonder Woman', 'Donna Troy']]

1// JS Tip of the Day
2// Live or static reference of ESModule import
3// https://jakearchibald.com/2021/export-default-thing-vs-thing-as-default/
4
5// These give you a live reference to the exported thing(s):
6import { thing } from './module.js';
7import { thing as otherName } from './module.js';
8import * as module from './module.js';
9const module = await import('./module.js');
10// This assigns the current value of the export to a new identifier:
11let { thing } = await import('./module.js');
12
13// These export a live reference:
14export { thing };
15export { thing as otherName };
16export { thing as default };
17export default function thing() {}
18// These export the current value:
19export default thing;
20export default 'hello!';