Author: John Au-Yeung

We can use the Math.max and Math.min methods to get the max and min dates respectively.

For instance, we can write:

const dates = [];
dates.push(new Date("2011/06/25"))
dates.push(new Date("2011/06/26"))
dates.push(new Date("2011/06/27"))
dates.push(new Date("2011/06/28"))
const maxDate = new Date(Math.max(...dates));
const minDate = new Date(Math.min(...dates));
console.log(minDate)
console.log(maxDate)

to compute the maxDate and minDate , which are the max and min dates in the dates array respectively.

dates have multiple date objects.

We spread the dates array into Math.max and Math.min , which will convert the dates entries into UNIX timestamps, which are numbers.

The spread operator also spread the numbers as arguments of both methods.

Then we pass in the returned timestamp into the Date constructor to recreate them as dates.

Therefore minDate is:

'Sat Jun 25 2011 00:00:00 GMT-0700 (Pacific Daylight Time)'

And maxDate is:

'Tue Jun 28 2011 00:00:00 GMT-0700 (Pacific Daylight Time)'

We can parse a number string with commas thousand separators into a number by removing the commas, and then use the + operator to do the conversion.

For instance, we can write:

const num = +'123,456,789'.replace(/,/g, '');
console.log(num)

We call replace with /,/g to match all commas and replace them all with empty strings.

And then we use the unary + operator to convert the string without the commas to a number.

Therefore, num is 123456789.

We can compare ES6 sets for equality by looping through its contents and check if any element in one set is missing in the other and check that their sizes are equal.

For instance, we can write:

const a = new Set([1, 2, 3]);
const b = new Set([1, 3, 2]);

const eqSet = (as, bs) => {
  if (as.size !== bs.size) {
    return false;
  }
  for (const a of as) {
    if (!bs.has(a)) {
      return false;
    }
  }
  return true;
}

console.log(eqSet(a, b));

We created the a and b sets which we want to compare.

Then we create the eqSet function with the as and bs parameters which are sets.

In the function, we compare is as and bs have different sizes. If they don’t then we return false .

Then if they have the same size, we loop through the as set with the for-of loop.

In the loop body, we check if bs is missing any items in as .

If something is missing, we return false .

If the loop is finished then we return true since both sets have the same size and has all the same elements.

Therefore, the console log should log true .

To get the CSS top property’s value as a number rather than a string, we should remove px from the end of the string.

Then we can convert that to a number with the + operator.

For instance, if we have the following div:

<div style='position: absolute; top: 10px'>  
  hello  
</div>

Then we can get the top CSS property’s value by writing:

const topCss = +$('div').css('top').replace('px', '')  
console.log(topCss)

We call css with 'top' to get the top property value as a pixel.

Then we call replace to remove 'px' by calling it with 'px' and an empty string.

Then we use the unary + operator to convert the number string into a number.

So topCss is 10.

To group multiple elements together without an extra wrapper div in React, we can use fragments.

To add them, we can use the React.Fragment component or <></> for short.

For instance, we can write:

import React from "react";

export default function App() {
  return (
    <>
      <div>a</div>
      <div>b</div>
      <div>c</div>
    </>
  );
}

or:

import React from "react";

export default function App() {
  return (
    <React.Fragment>
      <div>a</div>
      <div>b</div>
      <div>c</div>
    </React.Fragment>
  );
}