Get month name from Date

user_40521 0
Viewed 1231938

How can I generate the name of the month (e.g: Oct/October) from this date object in JavaScript?

var objDate = new Date("10/11/2009");
time-format date-format date javascript
39 Answers

If we need to pass our input then we need to use the following way

input: '2020-12-28'

Code:

new Date('2020-12-28').toLocaleString('en-us',{month:'short', year:'numeric'})

Output: "Dec 2020"

user_46527060

You could just simply use Date.toLocaleDateString() and parse the date wanted as parameter

const event = new Date(Date.UTC(2012, 11, 20, 3, 0, 0));

const options = {  year: 'numeric', month: 'short', day: 'numeric' };

console.log(event.toLocaleDateString('de-DE', options));
// expected output: Donnerstag, 20. Dezember 2012

console.log(event.toLocaleDateString('en-US', options));
// US format 


// In case you only want the month
console.log(event.toLocaleDateString(undefined, { month: 'short'}));
console.log(event.toLocaleDateString(undefined, { month: 'long'}));

You can find more information in the Firefox documentation

user_98113430

If you are in hurry...then here you go!

const date = new Date(Date.now());
date.toLocaleString('en-US', {month: 'short'}); // {month:'long'}

Expected Output: "Apr"

user_135744170 

document.write(new Date().toLocaleString('en-us',{month:'long', year:'numeric', day:'numeric'}))

user_85908540

Another way to format date

new Date().toLocaleString('en-us',{month:'long', year:'numeric', day:'numeric'}) //output: "May 21, 2019"
user_21651040

The easiest and simplest way:

const dateStr = new Date(2020, 03, 10).toDateString(); // 'Fri Apr 10 2020'
const dateStrArr = dateStr.split(' '); // ['Fri', 'Apr', '10', '2020']
console.log(dateStrArr[1]); // 'Apr'

  1. Convert the date to a string.
  2. Split by ' ' a space.
  3. Select second element of from array.
user_108223060

Tested on IE 11, Chrome, Firefox

const dt = new Date();
const locale = navigator.languages != undefined ? navigator.languages[0] : navigator.language;
const fullMonth = dt.toLocaleDateString(locale, {month: 'long'});
console.log(fullMonth);

user_14442460

You can try this:

let d = new Date(),
  t = d.toDateString().split(" ");

console.log(t[2] + " " + t[1] + " " + t[3]);

user_105020610

For me this is best solution is,

for TypeScript as well 

const env = process.env.REACT_APP_LOCALE || 'en';

const namedMonthsArray = (index?: number): string[] | string => {
  const months = [];

  for (let month = 0; month <= 11; month++) {
    months.push(
      new Date(new Date('1970-01-01').setMonth(month))
        .toLocaleString(env, {
          month: 'long',
        })
        .toString(),
    );
  }
  if (index) {
    return months[index];
  }
  return months;
};

Output is

["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
user_107223440

You can handle with or without translating to the local language

  1. Generates value as "11 Oct 2009"

const objDate = new Date("10/11/2009");
const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
if (objDate !== 'Invalid Date' && !isNaN(objDate)) {
  console.log(objDate.getDate() + ' ' + months[objDate.getMonth()] + ' ' + objDate.getFullYear())
}

  1. The ECMAScript Internationalization API to translate month to local language (eg: 11 octobre)

const convertDate = new Date('10/11/2009')
const lang = 'fr' // de, es, ch 
if (convertDate !== 'Invalid Date' && !isNaN(convertDate)) {
  console.log(convertDate.getDate() + ' ' + convertDate.toLocaleString(lang, {
    month: 'long'
  }))
}

user_10371330

It can be done as follows too:

var x = new Date().toString().split(' ')[1];    // "Jul"
user_99172850

To get Date formatted as "dd-MMM-yyyy" using JavaScript use the below code

const monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"
    ];

    const d = new Date();
    var dd = String(d.getDate()).padStart(2, '0');
    var mm = String(d.getMonth() + 1).padStart(2, '0');
    var yyyy = d.getFullYear();
    var fullDate = +dd +"-"+ monthNames[d.getMonth()] +"-"+ yyyy;
    document.write("The date is : "+ fullDate);

user_4149330

Just write a simple wrapper around toLocaleString :

function LocalDate(locale) {
  this.locale = locale;
}

LocalDate.prototype.getMonthName = function(date) {
  return date.toLocaleString(this.locale,{month:"long"});
};

var objDate = new Date("10/11/2009");

var localDate = new LocalDate("en");
console.log(localDate.getMonthName(objDate));

localDate.locale = "ru";
console.log(localDate.getMonthName(objDate));

localDate.locale = "zh";
console.log(localDate.getMonthName(objDate));

user_19465010

A quick hack I used which works well:

const monthNumber = 8;
const yearNumber = 2018;
const date = `${['Jan', 'Feb', 'Mar', 'Apr',
  'May', 'Jun', 'Jul', 'Aug',
  'Sep', 'Oct', 'Nov', 'Dec'][monthNumber - 1]
      } ${yearNumber}`;

console.log(date);

user_27402860

I did it via DatePipe.

const datePipe = new DatePipe(this.locale);
datePipe.transform(myDate, 'MMM. y');

You can inject the default locale inside your constructor like this:

constructor(@Inject(LOCALE_ID) private locale: string){}

Reference from Angular https://angular.io/api/common/DatePipe

user_11967260
Related