Solution

To get day from date in React, you can use the getDay() method it will return number between 0 to 6, with 0 representing Sunday, 1 representing Monday, and so on.

To format a date you can read my below article, here I have explained multiple ways to format a date.

https://reactjssnippet.com/posts/how-to-display-date-in-react-js/

Snippet

In this snippet, we will see short example to get day from date in react js.

const date = new Date("2022-12-28");

const day = date.getDay();


console.log("the day is: ", day) // the day is:  3

Example

In this example, we will write a react js code to get day from date object and show in the React UI.

Let’s list down what we are going to do below example.

  • Create day state
  • set day in state from date object ( useEffect )
  • Show Day name using day number
import React, { useState, useEffect } from "react";

const DAY_NAMES = [
  "Sunday",
  "Monday",
  "Tuesday",
  "Wednesday",
  "Thursday",
  "Friday",
  "Saturday"
];

export default function App() {
  const [day, setDay] = useState(null);
  const [dayName, setDayName] = useState(null);

  useEffect(() => {
    const date = new Date("2022-12-28");

    const dayIndex = date.getDay();
    setDayName(DAY_NAMES[dayIndex]);
    setDay(dayIndex);
  }, []);

  return (
    <div className="App">
      <h1>Current Day</h1>
      <p>{day}</p>
      <p>{dayName}</p>
    </div>
  );
}

Output

current, day

codesandbox