A Date module

#javascript #html #webdev

Hello!
What month is this month? Yes, it is an easy question for us.
So, how do we programme it with JavaScript? Yes, easy question again. We know we can use the "getMonth()" method.
Let's see a simple example below.

<sample.html>

<div>This month is <span id="tmonth"></span></div>
<script>
  var tmonth = document.getElementById("tmonth");
  const datetime = new Date();
  tmonth.innerHTML = datetime.getMonth();
</script>

If you make this HTML file, you notice that this is bad. The getMonth() method returns a number! So, the result above is "This month is 11."
Wait a minute! This month is December. Why 11?
Yes, it is because the getMonth() method returns 0 to 11! This means that we have to add extra 1 to datetime.getMonth() above. That's too nasty I think!

Well, okay, December is 11. We want it to return "December", not 11. How should we do? The answer is simple:

<sample.html>

<div>This month is <span id="tmonth"></span></div>
<script>
  var tmonth = document.getElementById("tmonth");
  const datetime = new Date();
  var monthname = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];       
  tmonth.innerHTML = monthname[datetime.getMonth()];
</script>

Actually, the day of the month returns 1 to 31 but the name of the week is same as the month and so the name of the weekday is, of course, implemented as above.
Every time we make a new application, we do this.
It's nonsense!

So, I made a module of this for you. Since I don't have any open repository on GitHub, please follow the itinerary below.

Make Files

Firstly, you make a file: datetime.js.
Two, read the file in an HTML file.

How to use

The module is just a JavaScript file. So, for example,

<sample.html>

  <div>Today is <span id="date"></span>/<span id="month"></span>/<span id="day"></span>/<span id="year"></span></div>       
  <script>
    document.getElementById("day").innerHTML = day;
    document.getElementById("month").innerHTML = month;
    document.getElementById("date").innerHTML = date;
    document.getElementById("year").innerHTML = year;
  </script>

You can use for English: month, monthuppercase, datenumber, day, dayuppercase, dayshort, dayshortuppercase,

for Deutsche: monat, monatuppercase, monatnummer, wochentage, wochentageuppercase, wochentageshort, wochentageshortuppercase,

for French: mois, moisuppercase, moislowercase, moisnumero, jour, jouruppercase, jourlowercase, jourshort,

for Italian: mesi, mesiuppercase, giorni, giorniuppercase, giornishort, giornishortlowercase,

for Japanese: tsukikanji, tsukisuuji, tsukiishou, youbifull, youbihalf, youbishort,

commonly: year, monthnumber, date, hour, minute, second, millisecond.

Comments

Any mistakes, all my fault. Your comment, your idea and what you want, very welcome! Safe journey!

Module

Finally, you copy and paste the JavaScript codes below to the datetime.js.

const hiduke = new Date();

// Year
var year = hiduke.getFullYear();


// Month
var tsuki = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
var month = tsuki[hiduke.getMonth()];

// Month UpperCase
var monthuppercase = month.toUpperCase();

// Month Number
var tsukinumber = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
var monthnumber = tsukinumber[hiduke.getMonth()];


// Date
var date = hiduke.getDate();

// Date Number
var hinichinumber = ["1st", "2nd", "3rd", "4th", "5th", "6th", "7th", "8th", "9th", "10th", "11th", "12th", "13th", "14th", "15th", "16th", "17th", "18th", "19th", "20th", "21st", "22nd", "23rd", "24th", "25th", "26th", "27th", "28th", "29th", "30th", "31st"];        
var datenumber = hinichinumber[hiduke.getDate() -1];


// Day
var youbi = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var day = youbi[hiduke.getDay()];

// Day UpperCase
var dayuppercase = day.toUpperCase();

// Day Short
var youbishort = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
var dayshort = youbishort[hiduke.getDay()];

// Day Short UpperCase
var dayshortuppercase = dayshort.toUpperCase();


// Hour
var hour = hiduke.getHours();


// Minute
var minute = hiduke.getMinutes();


// Second
var second = hiduke.getSeconds();


// MilliSecond
var millisecond = hiduke.getMilliseconds();





// DEUTSCHE
// Monat
var dtsuki = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
var monat = dtsuki[hiduke.getMonth()];

// Monat UpperCase
var monatuppercase = monat.toUpperCase();

// Monat Nummer
var monatnummer = tsukinumber[hiduke.getMonth()];


// Wochentage
var dyoubi = ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"];
var wochentage = dyoubi[hiduke.getDay()];

// Wochentage UpperCase
var wochentageuppercase = wochentage.toUpperCase();

// Wochentage Short
var dyoubishort = ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"];
var wochentageshort = dyoubishort[hiduke.getDay()];

// Wochentage Short UpperCase
var wochentageshortuppercase = wochentageshort.toUpperCase();




// FRENCH
// Mois
var ftsuki = ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Août", "Septembre", "Octobre", "Novembre", "Décembre"];
var mois = ftsuki[hiduke.getMonth()];

// Mois UpperCase
var moisuppercase = mois.toUpperCase();

// Mois LowerCase
var moislowercase = mois.toLowerCase();

// Mois Numéro
var moisnumero = tsukinumber[hiduke.getMonth()];


// Jour
var fyoubi = ["Dimanche", "lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"];
var jour = fyoubi[hiduke.getDay()];

// Jour UpperCase
var jouruppercase = jour.toUpperCase();

// Jour LowerCase
var jourlowercase = jour.toLowerCase();

// Jour Short
var fyoubishort = ["Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"];
var jourshort = fyoubishort[hiduke.getDay()];




// Italian
// Mesi
var itsuki = ["Gennaio", "Febbraio", "Marzo", "Aprile", "Maggio", "Giugno", "Luglio", "Agosto", "Settembre", "Ottobre", "Novembre", "Dicembre"];
var mesi = itsuki[hiduke.getMonth()];

// Mesi UpperCase
var mesiuppercase = mesi.toUpperCase();


// Giorni
var iyoubi = ["Domenica", "Lunedì", "Martedì", "Mercoledì", "Giovedì", "Venerdì", "Sabato"];
var giorni = iyoubi[hiduke.getDay()];

// Giorni UpperCase
var giorniuppercase = giorni.toUpperCase();

// Gironi Short
var iyoubishort = ["Dom", "Lun", "Mar", "Mer", "Gio", "Ven", "Sab"];
var giornishort = iyoubishort[hiduke.getDay()];

// Giorni Short LowerCase
var giornishortlowercase = giornishort.toLowerCase();




// JAPANESE
// Month
var jtsuki = ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"];
var tsukikanji = jtsuki[hiduke.getMonth()];

// Month Number
var jtsukin = ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"];
var tsukisuuji = jtsukin[hiduke.getMonth()];

// Month Another
var jtsukia = ["睦月", "如月", "弥生", "卯月", "皐月", "水無月", "文月", "葉月", "長月", "神無月", "霜月", "師走"];
var tsukiishou = jtsukia[hiduke.getMonth()];


// Date
var jyoubi = ["日曜日", "月曜日", "火曜日", "水曜日", "木曜日", "金曜日", "土曜日"];
var youbifull = jyoubi[hiduke.getDay()];

// Date Half
var jyoubih = ["日曜", "月曜", "火曜", "水曜", "木曜", "金曜", "土曜"];
var youbihalf = jyoubih[hiduke.getDay()];

// Date Short
var jyoubis = ["日", "月", "火", "水", "木", "金", "土"];
var youbishort = jyoubis[hiduke.getDay()];