Date format function in JavaScript

Question

How can I improve the date format function. I have written in javascript (ES5/ES6)? This code is just a part of an exercise.

function formatDate() {
 let bookingDate = new Date();
 let dayNumber = bookingDate.getDay();
 let date = bookingDate.getDate();
 let month = bookingDate.getMonth();
 let year = bookingDate.getFullYear();
 return ` ${getWeekday(dayNumber)}, ${monthName(
 month
 )} ${date}, ${year}`;
 function getWeekday(dayNumber) {
 let day = bookingDate.getDay();
 let DayName = [
 "Sunday",
 "Monday",
 "Tuesday",
 "Wednesday",
 "Thursday",
 "Friday",
 "Saturday"
 ];
 return DayName[dayNumber];
 }
 function monthName(month) {
 let monthNames = [
 "January",
 "February",
 "March",
 "April",
 "May",
 "June",
 "July",
 "August",
 "September",
 "October",
 "November",
 "December"
 ];
 return monthNames[month];
 }
 }

Answer 1

• Why are you getting day in function getWeekday and never using it?

• Use a IIF (Immediately Invoked Function) to close over constants so they do not need to be created each time you call the function that uses them (Note optimizer will cache such constants, though not on the first pass)

• Don't add unneeded details to names. booking is unrelated to the functions role, and should not be part of the name. You have added complexity where not needed.

  • The functions getWeekday and monthName are just array look ups and can be done directly via the index you pass the functions.
  • Almost all the variables you use are once off uses, you can side step the source and execution overhead by referencing the data directly.

• Be consistent in naming getWeekday and monthName do about the same thing yet the names are completely different. dayName and monthName would be more consistent.

• Use constants for variables that do not change.

Example 1

Use an IIF to define constants and returns a function that formats the date. Added date as an argument that defaults to new Date

Rather than creating an array by hand I use a short cut to convert a delimited string to an array. I find this easier to create string arrays this way.

const formatDate = (() => {
 const DAYS = "Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday".split(",");
 const MONTHS = "January,February,March,April,May,June,July,August,September,October,November,December".split(",");
 return (date = new Date()) => ` ${DAYS[date.getDay()]}, ${MONTHS[date.getMonth()]} ${date.getDate()}, ${date.getFullYear()}`;
})();

Example 2

Keeping to your original logic and layout, but behind an IIF. Note all the constants.

const formatNow = (() => {
 const DAYS = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
 const MONTHS = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
 const dayName = idx => DAYS[idx];
 const monthName = idx => MONTHS[idx];
 function format() {
 const now = new Date();
 const day = now.getDay();
 const date = now.getDate();
 const month = now.getMonth();
 const year = now.getFullYear();
 return ` ${dayName(day)}, ${monthName(month)} ${date}, ${year}`;
 }
 return format;
})();

• Rahul Dhingra: Thanks for the response . Your solution is neat . There is one type at the beginning of arrow function. you have used { } instead of ( ).
• Blindman67: @RahulDhingra Oh sorry my bad will fix it now.