资讯专栏INFORMATION COLUMN

Luxon 初步介绍(Moment 团队日期另一个类库)

stormzhang / 1945人阅读

摘要:我不是的深度用户只是日常会遇到一些时间格式化的需求之前用的都是不过对的感到有些不舒服同事介绍过里边用不可变数据的风格设计的所以就试试上星星很多请放心食用是项目的某个维护者开发的按照他个人想法进行了改进除了不可变性使用的工具做了更新也尝试到时

我不是 Moment 的深度用户, 只是日常会遇到一些时间格式化的需求,
之前用的都是 Moment, 不过对 Moment 的 mutable API 感到有些不舒服,
同事介绍过 Luxon, 里边用不可变数据的风格设计的 API, 所以就试试.
GitHub 上星星很多, 请放心食用 https://github.com/moment/luxon

Luxon 是 Moment 项目的某个维护者开发的, 按照他个人想法进行了改进,
除了不可变性, 使用的工具做了更新, 也尝试到时区做了更好的一些调整,
具体要看作者原文说明了 https://moment.github.io/luxo...

Luxon 和 Moment 的区别

文档有详细描述 https://moment.github.io/luxo...
最明显的一个例子, 就是不可变性(Immutability), 比如在 Moment 当中修改时间:

var m1 = moment();
var m2 = m1.add(1, "hours");
m1.valueOf() === m2.valueOf(); //=> true

原来的对象是会被修改的. 但是在 Luxon 当中旧的对象会保持不变:

var d1 = DateTime.local();
var d2 = d1.plus({ hours: 1 });
d1.valueOf() === d2.valueOf(); //=> false

这样, 基于旧的时间推移计算出新的时间的时候, 不用担心旧的数据被意外修改了.

在 API 风格上也有不小的调整. 比如例子当中就是 DateTime 这个对象了,
总体感觉 Luxon 命名相对啰嗦一点, 可能是为了更准确吧.

可能觉得好的一点就是比如读取 m.year 用了 Getter 接口, 这个更简单一点.
在上面的链接当中有详细的描述 https://moment.github.io/luxo...

另外专门看了下代码体积, 看上去是更大了. 反正两个都挺大的...
https://cdnjs.cloudflare.com/...
https://moment.github.io/luxo...

引用代码

Luxon 当中主要从 DateTime 开始调用, 根据平台不同写法不一样,
主要还是用 ES6 的语法引用 DateTime 对象吧:

var DateTime = luxon.DateTime;
const { DateTime } = require("luxon");

import { DateTime } from "luxon";

如果是在 ClojureScript 当中, 借助 shadow-cljs, 可以这样写:

(ns app (:require ["luxon" :refer [DateTime]]))

(.log js/console (.local DateTime))
创建日期的对象

Luxon 当中需要区分开很多的写法, 针对不用的格式:

DateTime.local() // 类似 Date.now()
DateTime.fromISO(String)
DateTime.fromObject(Object) // fromJSDate(date: Date, options: Object): DateTime
DateTime.fromMillis(Number)
DateTime.fromJSDate(Date)

实际调用的结果比如:

coffee> DateTime.local()
DateTime {
  ts: 2018-02-21T14:44:35.186+08:00,
  zone: Asia/Shanghai,
  locale: en-US }

coffee> date = new Date
2018-02-21T06:45:13.151Z

coffee> DateTime.fromJSDate(date)
DateTime {
  ts: 2018-02-21T14:45:13.151+08:00,
  zone: Asia/Shanghai,
  locale: en-US }

coffee> str = date.toISOString()
"2018-02-21T06:45:13.151Z"

coffee> DateTime.fromISO str
DateTime {
  ts: 2018-02-21T14:45:13.151+08:00,
  zone: Asia/Shanghai,
  locale: en-US }

再具体一些的用法, 可以去翻 API 文档:
https://moment.github.io/luxo...

格式化日期

内置格式没有怎么研究, 需要看上去业务不大用到, 提供格式尽管不少,

dt.toISO();         //=> "2017-04-20T11:32:00.000-04:00"

日期的格式化通过 dt.toFormat 方法来完成, 类似 m.format,
细节有些小的区别, 但是参考着文档来写吧:
https://moment.github.io/luxo...

DateTime.local().toFormat("HH "hours and" mm "minutes"") //=> "20 hours and 55 minutes"
日期的操作

请参考文档 https://moment.github.io/luxo...

DateTime.local(2017, 2, 13).plus({ months: 1 }).toISODate() //=> "2017-03-13"
d1 < d2 // is d1 before d2?
d1.hasSame(d2, "milllisecond"); // equivalent to `+d1 === +d2`
d1.hasSame(d2, "minute");       // both DateTimes are in the same minute (and hour, day, month, etc)
d1.hasSame(d2, "year");         // etc

Luxon 里有专门关于 Duration 的计算, 不大熟悉, 我就直接抄几个例子过一下了...
https://moment.github.io/luxo...

var dur = Duration.fromObject({ days: 3, hours: 6})
dur.as("minutes")       //=> 4680
var end = DateTime.fromISO("2017-03-13");
var start = DateTime.fromISO("2017-02-13");

var diffInMonths = end.diff(start, "months");
diffInMonths.toObject(); //=> { months: 1 }
其他

我能想到还有的一个功能是多语言, 因为 Moment 里就容易用到.
翻了文档没有翻到, 只有一些通过操作系统 API 处理多语言的描述, 不了解...
https://moment.github.io/luxo...

关于时区, Luxon 当中直接有支持, 看上去内容挺多, 然而不了解...
https://moment.github.io/luxo...

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/107543.html

相关文章

  • 前端每周清单第 40 期: JS 的 Core 与 Cost,Node 内存溢出调试,Softwar

    摘要:已被所有主流浏览器支持在过去几周苹果的浏览器与微软的浏览器分别发布新版本,支持了,再加上早已支持的和,已得到所有主流浏览器支持。 showImg(https://segmentfault.com/img/remote/1460000012086220?w=1240&h=823); 前端每周清单第 40 期: JS 的 Core 与 Cost,Node 内存溢出调试,Software 2...

    番茄西红柿 评论0 收藏0
  • 时间处理工具 moment.js:管理时间和日期,so easy!

    摘要:大家在项目中一定会遇到很多关于时间处理的问题,比如你想获取一个本地时间格式为,常用的方法是先拿到时间再用正则替换什么的。 大家在项目中一定会遇到很多关于时间处理的问题,比如你想获取一个本地时间格式为YYYY-MM-DD,常用的方法是先拿到时间再用正则替换什么的。比较麻烦,也比较费劲。每次都要弄。所以呢就想着有没有什么简单的方法,之后就发现了一个轻量级的Javascript日期处理类库:...

    lei___ 评论0 收藏0
  • 前端常用插件、工具类库汇总(上)

    摘要:函数库动画库动画库,也是目前最通用的动画库。下拉框级联选择器移动端最好用的的筛选器组件联动筛选移动端最好用的的筛选器组件联动筛选颜色选择器时间选择器时间日期处理是一个解析,验证,操作和显示日期和时间的类库。 showImg(https://segmentfault.com/img/bVbjpHt?w=900&h=383); 前言 在开发中,我们经常会将一些常用的代码块、功能块进行封装,...

    txgcwm 评论0 收藏0
  • moment日期处理库

    摘要:日期处理类库文档前天在实现日期选择器引用日期处理库,觉得有必要将常用的方法记录下来,特此一记。首发一文取值获取年月日时分秒获取星期天周操作一天后一周后一月后一年后一天前一周前一月前一年前 Javascript 日期处理类库 (moment.js) moment文档: http://momentjs.cn/ 前天在实现日期选择器引用moment日期处理库,觉得有必要将常用的方法记录下来,...

    andong777 评论0 收藏0
  • 前端那些小众而又精美的网站及工具

    摘要:写此文的目的是为了总结在开发中能增加我们开发速度及能给我们带来方便的工具与网站及一些小众框架只限于简介不负责教程如有相应的教程希望大家自荐或推荐我在这里感激不尽让我们发现美并记录它第一次写文章请多多包涵如有我没有写到的但又是一些好用的工具及 写此文的目的是为了总结在开发中能增加我们开发速度及能给我们带来方便的工具与网站及一些小众框架只限于简介不负责教程如有相应的教程希望大家自荐或推荐我...

    Edison 评论0 收藏0

发表评论

0条评论

stormzhang

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<