Slide 1

Slide 1 text

Temporal について Temporal について あらや @arayaryoma Meguro.es #19 @ oRo

Slide 2

Slide 2 text

自己紹介 自己紹介 あらや/Ryoma Abe あらや/Ryoma Abe 合同会社ヘマタイト/ フリーランス 合同会社ヘマタイト/ フリーランス @arayaryoma @arayaryoma JavaScript/TypeScript/Go/Kotlin 好き JavaScript/TypeScript/Go/Kotlin 好き Angular/React/ReactNative/Next.js Angular/React/ReactNative/Next.js

Slide 3

Slide 3 text

話すこと 話すこと Temporal とはなにか なぜ提案されているのか 使い方 注意点 議論されている内容

Slide 4

Slide 4 text

Temporal とは Temporal とは ECMAScript に出されているproposal の1 つ(Stage2) 一言でいうとDate よりも日付・時間を扱いやすくするためのもの Microsoft の方3 名・Bloomberg の方1 名の計4 名 がChampion ISO8601, IANA などの規格に準拠している Proposal: polyfill: https://github.com/tc39/proposal-temporal https://github.com/pipobscure/tc39-proposal-temporal

Slide 5

Slide 5 text

なぜproposal が出されたか なぜproposal が出されたか JavaScript のDate object が扱いづらい

Slide 6

Slide 6 text

Date の問題点 Date の問題点 Date object がタイムゾーンをサポートしていない Date の計算が扱いづらい グレゴリオ暦以外のカレンダーがサポートされていない parser が貧弱かつ無効なdate format 等について標準化されていない mutable である より https://maggiepint.com/2017/04/09/fixing­javascript­date­getting­started/

Slide 7

Slide 7 text

Date の問題点 Date の問題点 Date object がタイムゾーンをサポートしていない Date の計算が扱いづらい グレゴリオ暦以外のカレンダーがサポートされていない parser が貧弱かつ無効なdate format 等について標準化されていない mutable である より https://maggiepint.com/2017/04/09/fixing­javascript­date­getting­started/ Date への機能追加で対応できる 挙動を変えてしまうため、新しいobject がほしい

Slide 8

Slide 8 text

おまけ: なんでこんな使いづらいの? おまけ: なんでこんな使いづらいの? より https://maggiepint.com/2017/04/09/fixing­javascript­date­getting­started/ Brendan Eich がJavaScript を10 日で作り上げた時に、 Java のjava.Util.Date の実装をコピーした ただ、当時のjava.Util.Date は非常に使いづらく、 事実それらのほとんどが2 年後のJava1.1 でdeprecated となった

Slide 9

Slide 9 text

Temporal の用語 Temporal の用語 Civil Civil Instant Instant UTC と関連性を持たないオブジェクト UTC と関連性を持つオブジェクト CivilDate CivilTime CivilDateTime Instant ZonedInstant

Slide 10

Slide 10 text

使い方: 使い方:CivilDate const date = new CivilDate(2019, 2, 7); console.log(date.year, date.month, date.day); // -> 2019 2 7 console.log(date.dayOfWeek); // -> 4 // Monday - Sunday : 1 - 7 ISO 8601 準拠!! const newDate = date.plus({years: 1, months: 2, days: 30}); console.log(date.year, date.month, date.day); // -> 2019 2 7 console.log(newDate.year, newDate.month, newDate.day); // -> 2020 5 7 console.log(date.toDateString()); // -> "2019-02-07"

Slide 11

Slide 11 text

使い方: 使い方:CivilTime const time = new CivilTime(22, 45, 0, 0, 0, 0); console.log(time.hour, time.minute, time.second, time.millisecond, time.microsecond, time.nanosecond); // -> 22 45 0 0 0 0 const newTime = time.plus({hours: 1, minutes: 20}); console.log(time.hour, time.minute, time.second); // -> 22 45 0 console.log(newTime.hour, newTime.minute, newTime.second); // -> 0 5 0 console.log(time.toString()); // -> "22:45:00.000000000" const dateTime = time.withDate(new CivilDate(2018, 2, 7)); // CiviDate object を返す

Slide 12

Slide 12 text

使い方: 使い方:CivilDateTime const dateTime = new CivilDateTime(2019, 2, 7, 22, 45, 0); const newDateTime = dateTime.plus({years: 1, hours: 1}); console.log(dateTime.toString()); // -> "2019-02-07T22:45:00.000000000" console.log(newDateTime.toString()); // -> "2020-02-07T23:45:00.000000000" const zoned = dateTime.withZone('Asia/Tokyo'); // ZonedInstant object

Slide 13

Slide 13 text

使い方: 使い方:Instant const instant = new Instant(1549547100000) const instantWithNanoSec = new Instant(1549547100000000000n) // Polifyll のdoc ではnano 秒をBigInt で渡す仕様になっている const zoned = instant.withZone('Asia/Tokyo'); // ZonedInstant object console.log(instant.toString()); // -> "2019-02-07T22:45:00.000000000Z"

Slide 14

Slide 14 text

使い方: 使い方:ZonedInstant const instant = new Instant(1549547100000) const zoned = new ZonedInstant(instant, 'Asia/Tokyo'); const date = zoned.toCivilDate(); const time = zoned.toCivilTime(); const dateTime = zoned.toCivilDateTime(); const str = zoned.toString(); // "2019-02-07T22:45:00.000000000+09:00[Asia/Tokyo]" const newZoned = zoned.fromString(str); // fromString はtoString で返されうる文字列のみをサポート

Slide 15

Slide 15 text

議論されていること 議論されていること https://github.com/tc39/proposal-temporal/tree/master/meetings Temporal のAPI をDate にも登載するようなproposal を出すか否か Temporal にフォーカスすべき( 全会一致) Temporal って名前変えたほうがいい?批判受けたことある? No. どちらかというとCivil prefix への文句が多い。 Civil prefix については議論しましょう。 2 月末に仕様完成させたい。その後@std/temporal としてpolyfill をnpm に publish できるから最高。 入力として有効なものと無効なものを完全に定義したい。

Slide 16

Slide 16 text

使う際の注意点 使う際の注意点 仕様がまだ定まっていなく、doc の項目がTBD だったり polifyll とspec で合わない箇所がザラにある そもそもproposal が落ちる可能性あり format を指定して文字列をparse するといったことはできない。 ( 例えばWeb API が日付を"2019/02/07" で返してきた時など) // Go だとこういうことができる t, _ = time.Parse("2006/01/02", "2019/02/07")

Slide 17

Slide 17 text

まとめ まとめ Temporal はDate の失敗を繰り返さないためのmodule 実用するにはまだ厳しい 気になるproposal のmeeting note などを読むと、策定者たちが何を考えているのか見 られるのでオススメ // import standard library import { CivilDateTime, ZonedInstant } from 'std:Temporal'; const dateTimeTokyo = new CivilDateTime(2019, 2, 7, 22, 45); const instantInTokyo = dateTimeInTokyo.withZone('Asia/Tokyo'); const instantInSydney = new ZonedInstant(instantInTokyo.instant, 'Australia/Sydney'); const dateTimeInSydney = instantInSydney.toCivilDateTime(); dateTimeInTokyo.toString(); // '2019-02-07T22:45:00.000000000' dateTimeInSydney.toString(); // '2019-02-07T20:45:00.000000000' 20xx 年のJavaScript(??)

Slide 18

Slide 18 text

参考資料 参考資料 https://github.com/tc39/proposal-temporal https://github.com/pipobscure/tc39-proposal-temporal https://maggiepint.com/2017/04/09/fixing-javascript-date-getting-started/ https://en.wikipedia.org/wiki/ISO_8601