# moment.js 使って日本語曜日対応

javascript の時間取得って面倒ですね。ライブラリー使わずに取得使用と思ってたら年月日から一つずつ取って合体させるってなかなか手間な作業です。時間を便利に扱うために誕生したのが moment.js!

javascript ライブラリー使わずに時間取得

let now = new Date();

let Year = now.getFullYear();
let Month = now.getMonth() + 1;
let Day = now.getDate();
let Hour = now.getHours();
let Min = now.getMinutes();
let Sec = now.getSeconds();

console.log(
  Year + "-" + Month + "-" + Day + " " + Hour + ":" + Min + ":" + Sec
);

moment.js 使って時間取得

moment.locale("ja");
moment().format("MMMM Do YYYY, h:mm:ss a"); // 2月 3日 2021, 2:40:42 午後
moment().format("dddd"); // 水曜日
moment().format("MMM Do YY"); // 2月 3日 21
moment().format("YYYY [escaped] YYYY"); // 2021 escaped 2021
moment().format(); // 2021-02-03T14:40:42+09:00

moment("20111031", "YYYYMMDD").fromNow(); // 9年前
moment("20120620", "YYYYMMDD").fromNow(); // 9年前
moment().startOf("day").fromNow(); // 15時間前
moment().endOf("day").fromNow(); // 9時間後
moment().startOf("hour").fromNow(); // 41分前

moment().subtract(10, "days").calendar(); // 2021/01/24
moment().subtract(6, "days").calendar(); // 先週木曜日 14:41
moment().subtract(3, "days").calendar(); // 日曜日 14:41
moment().subtract(1, "days").calendar(); // 昨日 14:41
moment().calendar(); // 今日 14:41
moment().add(1, "days").calendar(); // 明日 14:41
moment().add(3, "days").calendar(); // 土曜日 14:41
moment().add(10, "days").calendar(); // 2021/02/13

moment js インストール

npm install moment

# nuxtjs で moment 使う

install

npm i @nuxtjs/moment

yarn add @nuxtjs/moment

nuxt.config.js に追加してロケールに日本を設定

buildModules: [
  '@nuxtjs/moment'
],

moment: {
  // グローバルに日本時間設定
  locales: ['ja']
},

# 現在 locale の月と曜日リストアップ

// 現在localeの月をリストアップ
moment.months();

// 現在localeの月略称をリストアップ
moment.monthsShort();

// 現在localeの曜日をリストアップ
moment.weekdays();

// 現在localeの曜日略称をリストアップ
moment.weekdaysShort();

// 現在localeの曜日最小略称をリストアップ
moment.weekdaysMin();

# 曜日の日本語設定

 moment.locale("ja", {
 weekdays: ["日曜日", "月曜日", "火曜日", "水曜日", "木曜日", "金曜日", "土曜日"],
 weekdaysShort: ["日", "月", "火", "水", "木", "金", "土"]
 });

// 現在日付と曜日
console.log(moment().format('YYYY年MM月DD日(ddd)');)

// 1日前
moment("2014-04-01").add('days', -1).format()

// 1日後
moment("2014-04-01").add('days', 1).format()

# 日付を比較

moment("2021-01-20").isBefore("2021-01-21"); // true
moment("2021-01-20").isSame("2021-01-20"); // true
moment("2021-01-20").isSame("2021-01-01", "year"); // true
2021-02-03

同じタグを持つ記事をピックアップしました。