『確かな力が身につくJavaScript「超」入門』を読んでいます 2
はじめに
『確かな力が身につくJavaScript「超」入門』を281ページまで読みました。それで復習のために、元号を表示する JavaScript を書きました。
元号を表示する JavaScript
前回のコードを使いながら、JavaScript を書きました。ただ、コードが大きくなって、読みやすいコードにできませんでした。もしかしたら、バグがあるかもしれません。
JavaScript コード
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>元号で日時を表示する</title> </head> <body> <p><span id="mytime"></span></p> <script> // 元号と年の文字列を生成する関数 var getImperialEra = function (_theDate) { var imperialEras = [ {eraName: '平成', date: new Date(1989, 1 - 1, 8)}, {eraName: '昭和', date: new Date(1926, 11 - 1, 25)}, {eraName: '大正', date: new Date(1912, 7 - 1, 30)}, {eraName: '明治', date: new Date(1868, 1 - 1, 25)} ]; for (var i = 0; i < imperialEras.length; i++) { if (_theDate.getTime() >= imperialEras[i].date.getTime()) { // 元号の期間 var year = _theDate.getFullYear() - imperialEras[i].date.getFullYear() + 1; return imperialEras[i].eraName + year; } } // 元号以外の期間 return '西暦' + _theDate.getFullYear(); }; // 午前または午後を判定する関数 var getGOZENOrGOGO = function (_theDate) { if (_theDate.getHours() < 12) { return '午前'; } else { return '午後'; } } // 元号の日時の文字列を返す関数 var getImperialDate = function (_theDate) { var year = getImperialEra(_theDate); var month = _theDate.getMonth() + 1; var amOrPm = getGOZENOrGOGO(_theDate); var date = _theDate.getDate(); var hours12 = _theDate.getHours() % 12; // 12時間表記の時刻。 var minutes = _theDate.getMinutes(); return (year + '年 ' + month + '月' + date + '日 ' + amOrPm + ' ' + hours12 + '時' + minutes + '分'); } // 時間を表示する関数 var putTime = function () { var now = new Date(); document.getElementById('mytime').textContent = getImperialDate(now); refresh(); } var refresh = function () { setTimeout(putTime, 30000); } putTime(); </script> </body> </html>
おわりに
とにかく『確かな力が身につくJavaScript「超」入門』を読み終わりたいと思います。