2021年5月30日日曜日

【JavaScript】Day.jsのAPIサンプル(Parse編)

 Day.jsの使い方を知るためにサンプルを作っています。

Parse

 日付や時刻を含む文字列や数値からオブジェクトを作成するものです。作成されたオブジェクトはUTC時間だったりするので、利用時は気を付けないと想定とずれた時間になります。

Parse

 テキストをオブジェクトに変換します。日本語の日付を使うなどする場合など、「Invalid Date」でエラーとなってしまうときは、CustomParseFormat プラグインを利用することも頭に入れておくとよいです。

const dayjs = require('dayjs');

// JST:2021-04-30 00:00:00
// UTC:2021-04-29 15:00:00 (日本との差は-9時間のため)
console.log( dayjs('2021-04-30', 'YYYY-MM-DD').toDate() );
// => 2021-04-29T15:00:00.000Z (UTC)
console.log( dayjs('2021年04月30日', 'YYYY年MM月DD日').toDate() );
// => Invalid Date (日本語があるとパースできない.)

// プラグインを追加 
const CustomParseFormat = require('dayjs/plugin/customParseFormat');
dayjs.extend(CustomParseFormat);

console.log( dayjs('2021年04月30日', 'YYYY年MM月DD日').toDate() );
// => 2021-04-29T15:00:00.000Z (日本語があってもパースできる.)
console.log( dayjs('2021年04月30日', 'YYYY年MM月DD日').locale('ja').format() );
// => 2021-04-30T00:00:00+09:00 (日本でロケールしてみただけ.)

Now

 現在時刻のオブジェクト取得します。日本時間にするには ロケール変換+format() します。

const dayjs = require('dayjs');

let now_utc = dayjs();
let now_jst = dayjs().locale('ja');
console.log( now_utc.toDate() );
// => 2021-04-30T00:09:31.085Z (こちらは0時)
console.log( now_jst.format() );
// => 2021-04-30T09:09:31+09:00 (こちらは9時. toDate() はUTCになってしまうので注意.)

String

 ISO 8601形式の文字列からオブジェクトを作成します。日付と時刻の間に"T"を付け、時刻の後ろに"Z"や"+0900"などを付与した文字列です。

const dayjs = require('dayjs');

let utc = dayjs('2021-04-15T15:00:00.000Z');
console.log( utc.toDate() );

let jst = dayjs('2021-04-15T15:00:00.000+0900');
console.log( jst.locale('ja').format() ); // toDate()はUTC時間で出力される

String + Format

 事前に日付のフォーマットわかっていれば、引数の日付の文字列からオブジェクトが作成できます。注意すべきは CustomParseFormat プラグインを使わなければいけないことです。補足ですが、dayjs()の第4引数に真偽を指定すると、結果が変わります。

const dayjs = require('dayjs');
// プラグイン
const customParseFormat = require('dayjs/plugin/customParseFormat');

dayjs.extend(customParseFormat); // プラグイン追加
let jst = dayjs('2021年10月18日', 'YYYY年MM月DD日', 'ja');
console.log(jst.locale('ja').format());

let jst_imp = dayjs('2021年10月32日', 'YYYY年MM月DD日', 'ja');
let jst_strict = dayjs('2021年10月32日', 'YYYY年MM月DD日', 'ja', true);

console.log(jst_imp.locale('ja').format());
// => 2021-11-01T00:00:00+09:00  第4引数がtrueでない場合、日付の繰り越しが起こる.
console.log(jst_strict.locale('ja').format());
// => Invalid Date 第4引数がtrueの場合、日付の厳密性がチェックされ、存在しない日付の場合、
エラー(Invalid Date)になる.

 日付のフォーマットが1つではなく複数指定される可能性がある場合でもオブジェクト作成できます。日付のフォーマットを配列で指定してあげます。

const dayjs = require('dayjs');
const customParseFormat = require('dayjs/plugin/customParseFormat');

dayjs.extend(customParseFormat);
let date  = dayjs("2001-12-25", ["YYYY", "YYYY-MM-DD"], 'ja', true);
let date2 = dayjs("2001", ["YYYY", "YYYY-MM-DD"], 'ja', true);
console.log(date.locale('ja').format());  // => 2001-12-25T00:00:00+09:00
console.log(date2.locale('ja').format()); // => 2001-01-01T00:00:00+09:00


let date3 = dayjs("2001-25-12", ["YYYY", "YYYY-MM-DD"], 'ja', true);
let date4 = dayjs("2001-25-12", ["YYYY", "YYYY-MM-DD"], 'ja');
console.log(date3.locale('ja').format());  // => Invalid Date
console.log(date4.locale('ja').format());  // => 2001-01-01T00:00:00+09:00

Unix Timestamp (milliseconds)

 ミリ秒を表す数値を指定することでオブジェクトを作成します。基準日は1970年1月1日午前0時です。引数に指定したミリ秒だけ加算された日時のオブジェクトが作成されます。

const dayjs = require('dayjs');

let date = dayjs(0);
console.log( date.toDate() );
// => 1970-01-01T00:00:00.000Z

let date1 = dayjs(1);
console.log( date1.toDate() );
// => 1970-01-01T00:00:00.001Z

Unix Timestamp (seconds)

 秒を表す数値を指定し、オブジェクトを作成します。基準日は1970年1月1日午前0時です。引数に指定した秒だけ加算された日時のオブジェクトが作成されます。

const dayjs = require('dayjs');

let date = dayjs.unix(0);
console.log( date.toDate() );
// => 1970-01-01T00:00:00.000Z

let date2 = dayjs.unix(1);
console.log( date2.toDate() );
// => 1970-01-01T00:00:01.000Z dayjs()をラップしている.

let date3 = dayjs( 1 * 1000 );
console.log( date3.toDate() );
// => 1970-01-01T00:00:01.000Z 

Date

 JavaScriptのDateオブジェクトからオブジェクトを作成します。Dateオブジェクトのクローンを返すため、元のDateオブジェクトを変更しても、Day.jsオブジェクトは変更されません。その逆も同様です。

const dayjs = require('dayjs');

var d = new Date(2019, 7, 18); // monthは0-11を指定し、1月-12月を扱う罠.
var day = dayjs(d);

console.log( d );  // => 2019-08-17T15:00:00.000Z
console.log( day.toDate() );  // => 2019-08-17T15:00:00.000

Object

 オブジェクトからDay.jsオブジェクトを作成します。ObjectSupport プラグインを追加して使用します。

const dayjs = require('dayjs');
const ObjectSupport = require('dayjs/plugin/objectSupport'); // プラグイン

// プラグイン追加.
dayjs.extend(ObjectSupport);

let now = dayjs();
let date = dayjs({ hour:15, minute:10 });
console.log( now.toDate() );
// => 2021-05-01T07:51:36.994Z
console.log( date.toDate() );
// => 2021-05-01T06:10:00.000Z
// 当日の日本時間15時10分を指す?。UTCにすると9時間前なので、6時10分となる。

now = dayjs();
let date2 = dayjs({});  // 空のオブジェクトは現在日時
console.log( now.toDate() );
// => 2021-05-01T07:54:59.148Z
console.log( date2.toDate() );
// => 2021-05-01T07:54:59.148Z

let date3 = dayjs({ year :2010, month :3, day :5, hour :15, minute :10, second :3, millisecond :123});
console.log( date3.toDate() );
// => 2010-04-05T06:10:03.123Z
// monthは0-11の整数で、1月-12月を表す.

Array

 配列からDay.jsオブジェクトを作成します。arraySupport プラグインを追加する必要があります。dayjs([]) は現在時刻です。

const dayjs = require('dayjs');
const ArraySupport = require('dayjs/plugin/arraySupport');

dayjs.extend(ArraySupport);

// [ 年、月、日、時、分、秒、ミリ秒 ]
let date = dayjs([2010, 1, 14, 15, 25, 50, 125]);
console.log( date.toDate() );
// => 2010-02-14T06:25:50.125Z
// month部分は0-11を指定することで、1月-12月を表します。
// ログ出力ではUTC時間になるため、時刻が9時間前となります。 

let date2 = dayjs([2010, 6]);     // July 1st
console.log( date2.toDate() );
// => 2010-06-30T15:00:00.000Z
// month:6 は7月のこと。7/1 00:00:00から-9時間となり、6/30 15:00:00となる。 
// UTC時間は面倒だ。

UTC

 UTC時間のDay.jsオブジェクトを作成します。

const dayjs = require('dayjs');
const utc = require('dayjs/plugin/utc');

dayjs.extend(utc);

let date = dayjs();
console.log( date.format() );
// => 2021-05-02T09:10:25+09:00
// 日本で実行しているので、format()は日本時間が出力される。
let date_utc = dayjs().utc();
console.log( date_utc.format() );
// => 2021-05-02T00:10:25Z
// 日本で実行していても、format()はUTC時間で出力される。 

Dayjs Clone

 Day.jsオブジェクトを複製して、同じオブジェクトを作成します。2種類の方法があり、複製元からclone()を使うか、dayjs()の引数に複製元を渡すかです。

const dayjs = require('dayjs');

let a = dayjs();
let b = a.clone();

console.log( a.toDate() ); // => 2021-05-02T00:18:31.274Z
console.log( b.toDate() ); // => 2021-05-02T00:18:31.274Z

a = dayjs();
b = dayjs(a);

console.log( a.toDate() ); // => 2021-05-02T00:18:31.325Z
console.log( b.toDate() ); // => 2021-05-02T00:18:31.325Z

Validation

 日付が正しいかチェックします。customParseFormat プラグインを使用します。注意しなければならないのは、dayjs()の第3引数の真偽です。厳密に日付の正しさを求めるならば true を指定します。そうでない場合、日付が正しくない場合でも繰り上げなどの計算をしてくれます。

const dayjs = require('dayjs');
// プラグイン
const customParseFormat = require('dayjs/plugin/customParseFormat');

// プラグインを追加 
dayjs.extend(customParseFormat);

let date = dayjs('2021-03-19', 'YYYY-MM-DD', true);
console.log( date.isValid() ); // => true

let date2 = dayjs('2021-15-19', 'YYYY-MM-DD', true);
console.log( date2.isValid() ); // => false

// 日付の形式が合っていればOKのやりかた。
let date3 = dayjs('2021-13-19', 'YYYY-MM-DD');
console.log( date4.isValid() ); // => true. 日付の形式が合っていればOKとなる。
console.log( date3.toDate() );
// => 2022-01-18T15:00:00.000Z
// 日付を勝手に繰り上げする.