JavaScriptで12時間表記の時刻を24時間表記に変換する方法

今回は、「05:00 PM」のような形式で与えられた時刻文字列を受け取り、それを24時間表記の時刻に変換して返すJavaScript関数を作成します。

const timeStr = '05:00 PM';

入力される文字列は常に同じ形式であることが前提です。つまり、以下のようなフォーマットになります。

HH:MM AM/PM

この関数は、受け取った文字列に対して必要な計算を行い、対応する24時間表記の時刻を「HH:MM」の形式で返す必要があります。

具体例

たとえば、上記の文字列の場合、期待される出力は以下のとおりです。

const output = '17:00';

実装例

実際のコードは次のようになります。

const timeStr = '05:00 PM';
const secondTimeStr = '11:42 PM';
const convertTime = timeStr => {
    const [time, modifier] = timeStr.split(' ');
    let [hours, minutes] = time.split(':');
    if (hours === '12') {
        hours = '00';
    }
    if (modifier === 'PM') {
        hours = parseInt(hours, 10) + 12;
    }
    return `${hours}:${minutes}`;
};
console.log(convertTime(timeStr));
console.log(convertTime(secondTimeStr));

コードの解説

この関数が動作する仕組みを、順を追って見ていきましょう。

• スペースでの分割： split(' ') を使って文字列を分割し、時刻部分(「05:00」)と午前・午後を示す修飾子(「PM」)に分けます。
• コロンでの分割： 時刻部分を split(':') でさらに分割し、時間と分を個別に取得します。
• 深夜0時の処理： 時間が「12」の場合は「00」に置き換えます。これにより、正午(12:00 PM)や深夜0時(12:00 AM)も正しく扱えます。
• 午後(PM)への対応： 修飾子が「PM」の場合、parseInt() で数値化した時間に12を加算します。
• 結果の組み立て： テンプレートリテラルを利用して「HH:MM」形式の文字列を生成し、返り値として返します。

実行結果

このコードを実行すると、コンソールには次のように出力されます。

17:00
23:42

このように、シンプルな文字列操作だけで12時間表記から24時間表記への変換を実現できます。入力形式が固定されている場合は、外部ライブラリを使わずに軽量かつ確実に処理できるのがメリットです。