Get difference between 2 dates in JavaScript

const date1 = new Date('10/15/2020');
const date2 = new Date('12/1/2020');

const diffTime = Math.abs(date2 - date1); // time in milliseconds
const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); // convert time to days

Note: Difference in date always return in milliseconds.

How to remember

- 1000 Milliseconds to 1 Sec
- 60 Sec 1 Minute
- 60 Min 1Hr
- 24 Hr to 1 Day

React : Use Single Handler to update all input textbox


    const handleUpdateInput = (e) => {
        let key = e.target.name;
        setEmpData({
            ...empData,
            [key]:e.target.value
        })

    }

7 - ES6 Features

- let & const 
- Arrow Functions
- Template literals
- Default Parameter value 
- Spread and rest 
- destructuring  
   const { name } = person;
- object literals 
    let person = { name } // key and value is same 

What is useCallback and Why it's required.


The useCallback hook is used where we have to check the reference equality (i.e functions, callback functions)

where we have normal props check we can user React.Memo ( remember React.Memo is nothing to do with useMemo hook )

useCallback is mainly used when we pass function as callback function in react components


Before Using Callback


const incrementSalary = () => {
   setSalary(salary + 1000 )
}


After Using callback funcation

const incrementSalary = useCallback(() => {
   setSalary(salary + 1000 )
}, [age])

Pure Memoization in JavaScript | Closures Example

function square(num) {
  return num * num;
}

function memoizedSquare() {
  let cache = {}
  return function optimizedSquare(num) {
    //console.log(JSON.stringify(cache));
    if(num in cache) {
      console.log('returning from cache);
      return cache[num];
    }else {
      console.log('computing square');
      const result = square(num);
      cache[num] = result;
      return result;
    }
  }
}

const memoSquare = memoizedSquare();
console.log(memoSquare(10));
console.log(memoSquare(20));
console.log(memoSquare(30));
console.log(memoSquare(30));

What is Closures is javascript

Closures 

Function along with its lexical scope bundled together forms a closure. it's called Closures.

How to cancel/abort ajax request in axios

useEffect(() => {    const ourRequest = Axios.CancelToken.source() // <-- 1st step      const fetchPost = async () => {      try {        const response = await Axios.get(`endpointURL`, {          cancelToken: ourRequest.token, // <-- 2nd step        })        console.log(response.data)        setPost(response.data)        setIsLoading(false)      } catch (err) {        console.log('There was a problem or request was cancelled.')      }    }    fetchPost()      return () => {      ourRequest.cancel() // <-- 3rd step    }  }, [])