为了账号安全,请及时绑定邮箱和手机立即绑定

在JavaScript中用date-fns管理日期和时间[图]

在JavaScript中使用日期和时间不是一件容易的事。这就是为什么在许多app的package.json文件中可以看到像Moment.js这种类库。

Moment.js是最流行的日期管理类库之一,有了它web工程师可以方便地解析,格式化和计算日期。

不过近期Moment.js在官网发布了公告,正式宣布项目进入维护状态,甚至可能不再修复发现的bug。

那么问题来了:我们还有哪些其他选择呢?

Moment.js开发团队推荐了几个类库,其中一个便是date-fns。date-fns被认为是一个优秀的替代品,不只是因为它提供了同样丰富的功能,此外它遵循函数式编程规范,也是一大优势。

书笔记网https://www.yuananren.com

安装date-fns

你可以使用npm/Yarn安装date-fns:

格式化日期

格式化日期是像Moment.js/date-fns这类库的基础功能。这是因为JavaScript没有内置的方法来解决这个问题。

date-fns使用了和Moment.js类似的字符串模式:

就这么简单。它支持许多日期格式,可以在官方文档上查阅。

增加/减少日期

现在我们可以格式化日期了,该怎么对日期应用加法和减法呢?有几个函数可以帮我们完成这个任务:

addDays

subDays

addWeeks

subWeeks

addMonths

subMonths

在下面的例子中,我们为指定日期增加1年:

日期本地化

格式化日期很容易,但是如何本地化日期呢?我们都知道访问网站的访客可能来自世界各地,我们不能要求他们都和我们的语言一样。

JavaScript(简称“JS”)是一种具有函数优先的轻量级,解释型或即时编译型的高级编程语言。虽然它是作为开发Web页面的脚本语言而出名的,但是它也被用到了很多非浏览器环境中,JavaScript基于原型编程、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如函数式编程)风格。

JavaScript在1995年由Netscape公司的BrendanEich,在网景导航者浏览器上首次设计实现而成。因为Netscape与Sun合作,Netscape管理层希望它外观看起来像Java,因此取名为JavaScript。但实际上它的语法风格与Self及Scheme较为接近。书笔记网https://www.yuananren.com编程语言JavaScript的标准是ECMAScript。截至2012年,所有浏览器都完整的支持ECMAScript5.1,旧版本的浏览器至少支持ECMAScript3标准。2015年6月17日,ECMA国际组织发布了ECMAScript的第六版,该版本正式名称为ECMAScript2015,但通常被称为ECMAScript6或者ES6。

对于这个需求,可以导入指定的本地化插件:

对比两个日期

对比两个日期的功能对于一个日期类库来说至关重要。date-fns提供了几个函数来做这件事。

例如,我们可以计算从1月1日到圣诞节的自然日天数以及工作日天数:

date-fns体积小巧

Moment.js被饱受诟病的一点是它庞大的体积。没办法导入单独的函数,因为它的API只允许链式调用。这意味着你需要导入整个库:

而在date-fns中,你只需要导入所需的函数即可:

这么做的好处是date-fns的依赖包比Moment.js更小,下图展示了两者的区别:

结语

随着Moment.js的落幕,date-fns正受到越来越多的关注,日常开发也比较活跃。它丰富的功能以及对于ES6的良好支持,值得你在下一个项目中尝试一下它!


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消