GAS版Moment.jsの破壊的な日時計算メソッドの注意点とcloneメソッドによる回避

2020.04.14 2017.02.14

photo credit: Kristjan Aunver 17 ruined in a day two via photopin (license)

みなさん、こんにちは！
タカハシ(@ntakahashi0505)です。

Google Apps Scriptで日付＆時刻の便利ライブラリMoment.jsを使う方法についてお伝えしています。

前回の記事はコチラ。

GASでMoment.jsライブラリを使って簡単に日時の計算をする方法

Google Apps Scriptで日付＆時刻の便利ライブラリMoment.jsを使う方法についてお伝えしています。今回はmomentオブジェクトによる日時の加算・減算についてお伝えしていきます。

Moment.jsで日時の加算・減算をする方法についてお伝えしました。

しかし、その際に使うaddメソッドとsubtractメソッドには実は注意点があります。

使うと元のmomentオブジェクト自身が変更されてしまうのです。

これを別の言葉で「破壊的」というのですが、元のmomentオブジェクトも変更されちゃうと困るときありますし、わけがわからなくなりやすいですよね。

ということで、今回はGoogle Apps Scriptでmomentオブジェクトに対する破壊的メソッドついてまたcloneメソッドで元のデータを変更しないで日時計算をする方法です。

では、行ってみましょう！

Dateオブジェクトの日時計算は破壊的
momentオブジェクトの日時計算も破壊的
cloneメソッドでmomentオブジェクトのクローンを作る
まとめ
連載目次：Google Apps ScriptでMoment.jsを使う

Dateオブジェクトの日時計算は破壊的

まずはDateオブジェクトになりますが、以下のような日時の加算・減算をするスクリプトを実行してみましょう。

const date = new Date('2020/2/1');
const date1 = new Date(date.setMonth(date.getMonth() + 1)); //2020/3/1

1 2	const date = new Date('2020/2/1'); const date1 = new Date(date.setMonth(date.getMonth() + 1)); //2020/3/1

dateに対してgetMonthしたものにプラス1をしてsetMonthをします。簡単に言うと一月後になるわけですね。

では、以下のように、その後にdateの日にちをマイナス3してdate2に代入したとしましょう。

const date = new Date('2020/2/1');
const date1 = new Date(date.setMonth(date.getMonth() + 1)); //2020/3/1
const date2 = new Date(date.setDate(date.getDate() - 3)); //2020/1/29ではなくて2020/2/27

const date = new Date('2020/2/1');

const date1 = new Date(date.setMonth(date.getMonth() + 1)); //2020/3/1

const date2 = new Date(date.setDate(date.getDate() - 3)); //2020/1/29ではなくて2020/2/27

おそらく皆さんもdate2の値として「2020/1/29」を期待していると思うのですが、実はその値は「2020/2/27」になってしまいます。

このような事態が発生する理由は、setMonthやsetDateなどのメソッドが元のDateオブジェクト自体を変更してしまうという特性を持っているからなんですね。

このような特性を持つメソッドを「破壊的メソッド」と言います。

momentオブジェクトの日時計算も破壊的

前回の記事では、Moment.jsライブラリのaddメソッド、subtractメソッドで簡単に日時の計算をする方法をお伝えしたのですが、実はこれらのメソッドも残念ながら「破壊的メソッド」です。

以下スクリプトも、前述のDateオブジェクトと同様の結果となってしまうのです。

const m = Moment.moment('2020/2/1')
const m1 = m.add(1,'months'); //2020/3/1
const m2 = m.subtract(3,'d'); //2020/2/27

const m = Moment.moment('2020/2/1')

const m1 = m.add(1,'months'); //2020/3/1

const m2 = m.subtract(3,'d'); //2020/2/27

ですから、後半のsubtractメソッドも、元の「2020/1/29」に対して実行をしたいのであれば

const m = Moment.moment('2020/2/1')
const m1 = Moment.moment(m); //2020/2/1
m1.add(1,'months'); //2020/3/1

const m2 = Moment.moment(m); //2020/2/1
m2.subtract(3,'d'); //2020/1/29

const m = Moment.moment('2020/2/1')

const m1 = Moment.moment(m); //2020/2/1

m1.add(1,'months'); //2020/3/1

const m2 = Moment.moment(m); //2020/2/1

m2.subtract(3,'d'); //2020/1/29

このように、一度momentオブジェクトを別のmomentオブジェクトにコピーしてから、その別のオブジェクトに対してaddメソッドやsubtractメソッドを実行する必要が出てきます。

んー、ちょっと面倒ですよね。

cloneメソッドでmomentオブジェクトのクローンを作る

そんな時に、momentオブジェクトの複製を作るcloneメソッドが便利です。

こう書きます。

momentオブジェクト.clone()

これで、momentオブジェクトのコピーのオブジェクトが生成されます。

例えば、前述の加算してから減算のスクリプトは

function calcDate(){

  const m = Moment.moment('2020/2/1')
  const m1 = m.clone().add(1,'months'); //2020/3/1
  const m2 = m.clone().subtract(3,'d'); //2020/1/29
  console.log(m.format()); //2020/2/1

}

function calcDate(){

const m = Moment.moment('2020/2/1')

const m1 = m.clone().add(1,'months'); //2020/3/1

const m2 = m.clone().subtract(3,'d'); //2020/1/29

console.log(m.format()); //2020/2/1

}

と書けばOKです。

このように、cloneメソッドで複製をしたものに対してaddメソッド、subtractメソッドを実行することで、元のmomentオブジェクトは破壊されなくて済みます。

まとめ

以上、Google Apps Scriptでmomentオブジェクトに対するaddメソッド、subtractメソッドを使うときの注意点、そしてcloneメソッドを使って元のオブジェクトを変更せずに日時計算を行う方法でした。

破壊的メソッド…名前はかっこいいですけど、知らないと頭の中がむちゃくちゃになりそうですね。

ぜひ、その存在とcloneメソッドによる回避法を覚えておいていただければと思います。

次回は、momentオブジェクトについての日時の差をとる方法についてお伝えします。

GASでMoment.jsライブラリを使って超スマートに日時の差をとる方法

Google Apps Scriptで日付＆時刻の便利ライブラリMoment.jsを使う方法についてお伝えしています。今回はdiffメソッドを使って、スマートにmomentオブジェクトの差をとる方法です。

どうぞお楽しみに！

連載目次：Google Apps ScriptでMoment.jsを使う

Google Apps Scriptでよく取り扱う日付と時刻。しかし、JavaScriptの標準Dateオブジェクトは扱いがなかなか難しいんですよね。その日時の操作をとっても簡単にすることができるライブラリ「Moment.js」の使い方について、解説をしていきます。

　　投稿者プロフィール

タカハシノリアキ株式会社プランノーツ　代表取締役

株式会社プランノーツ代表、コミュニティ「ノンプロ研」主宰。1976年こどもの日生まれ。東京板橋区在住。「ITで日本の『働く』の価値を上げる！」をテーマに、VBA＆GASの開発、講師、執筆などをしております。→詳しいプロフィールはコチラ
★ご依頼・ご相談はお気軽にどうぞ！→お問い合わせはコチラ
★フォロー頂ければ嬉しいです。