实现简易版的moment.js
github源码地址: www.baidu.com
作者: 易怜白
项目中使用了时间日期的处理方法,只使用了部分方法,为了不在引入第三方的库(moment.js),这里自己封装了项目中使用到的方法。
要实现以下功能:
new Moment() // 返回当前的时间对象 new Moment().unix() // 返回当前时间的秒数 Moment.unix(timestamp) // 传入秒数,返回传入秒数的时间对象 new Moment().format('YYYY-MM-DD dd HH:mm:ss') // 返回值 2017-06-22 四 19:46:14 Moment.unix(1498132062000).format('YYYY-MM-DD dd HH:mm:ss') // 返回值 2017-06-22 四 19:46:14
一、基础代码:
class Moment { constructor(arg = new Date().getTime()) { this.date = new Date(arg) } }
arg = new Date().getTime() :这里使用解构对arg添加默认值
二、实现unix方法
class Moment { constructor(arg = new Date().getTime()) { this.date = new Date(arg) } // getTime()返回的是毫秒数,需要转成秒数并取整 unix() { return Math.round(this.date.getTime() / 1000) } }
unix方法:返回当前时间的秒数
三、实现静态unix方法
class Moment { constructor(arg = new Date().getTime()) { this.date = new Date(arg) } static unix(timestamp) { return new Moment(timestamp * 1000) } }
静态unix方法:参数timestamp 毫秒数 返回一个Date对象
四、实现format方法
class Moment { constructor(arg = new Date().getTime()) { this.date = new Date(arg) } format(formatStr) { const date = this.date const year = date.getFullYear() const month = date.getMonth() + 1 const day = date.getDate() const week = date.getDay() const hour = date.getHours() const minute = date.getMinutes() const second = date.getSeconds() return formatStr.replace(/Y{2,4}|M{1,2}|D{1,2}|d{1,4}|H{1,2}|m{1,2}|s{1,2}/g, (match) => { switch (match) { case 'YY': return String(year).slice(-2) case 'YYY': case 'YYYY': return String(year) case 'M': return String(month) case 'MM': return String(month).padStart(2, '0') case 'D': return String(day) case 'DD': return String(day).padStart(2, '0') case 'd': return String(week) case 'dd': return weeks[week] case 'ddd': return '周' + weeks[week] case 'dddd': return '星期' + weeks[week] case 'H': return String(hour) case 'HH': return String(hour).padStart(2, '0') case 'm': return String(minute) case 'mm': return String(minute).padStart(2, '0') case 's': return String(second) case 'ss': return String(second).padStart(2, '0') default: return match } }) } }
实现简易版的moment.js的更多相关文章
- 来,我们手写一个简易版的mock.js吧(模拟fetch && Ajax请求)
预期的mock的使用方式 首先我们从使用的角度出发,思考编码过程 M1. 通过配置文件配置url和response M2. 自动检测环境为开发环境时启动Mock.js M3. mock代码能直接覆盖g ...
- 一个极其简易版的vue.js实现
前言 之前项目中一直在用vue,也边做边学摸滚打爬了近一年.对一些基础原理性的东西有过了解,但是不深入,例如面试经常问的vue的响应式原理,可能大多数人都能答出来Object.defineProper ...
- 一个简易版的Angular js 三层 示例
var myApp = angular.module('produceline', []); myApp.factory('ajax', ["$http", "$q&qu ...
- 实现简易版德州扑克|学习麻瓜编程以项目为导向入门前端 HTML+CSS+JS
实现简易版德州扑克 1.先上达到网页效果图(简易版德州扑克) 网页分为发牌区和牌池,上面为发牌区,下面是牌池区 2. 代码实现 2.1 HTML和JS代码 ` <link rel="s ...
- 使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包
使用 js 和 Beacon API 实现一个简易版的前端埋点监控 npm 包 前端监控,埋点,数据收集,性能监控 Beacon API https://caniuse.com/beacon 优点,请 ...
- 使用 js 实现一个简易版的模版引擎
使用 js 实现一个简易版的模版引擎 regex (function test() { this.str = str; })( window.Test = ...; format() { let ar ...
- 使用 js 实现一个简易版的 drag & drop 库
使用 js 实现一个简易版的 drag & drop 库 具有挑战性的前端面试题 H5 DnD js refs https://www.infoq.cn/article/0NUjpxGrqRX ...
- 使用 js 实现一个简易版的动画库
使用 js 实现一个简易版的动画库 具有挑战性的前端面试题 animation css refs https://www.infoq.cn/article/0NUjpxGrqRX6Ss01BLLE x ...
- 使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序
使用 js 实现一个简易版的 GIPHY 动图搜索 web 应用程序 具有挑战性的前端面试题 API JAMstack refs https://www.infoq.cn/article/0NUjpx ...
随机推荐
- IOS中的UIScrollView
要引用UIScrollView 首先要遵循UIScrollViewDelegate协议 然后重写 //1.拖拽方法 -(void)scrollViewDidScroll:(UIScrollView * ...
- Docker - 容器直连
本文是在原文基础上的实际操作验证记录和细节补充. 默认情况下,容器连接到虚拟网桥docker0提供的虚拟子网中,容器之间通过默认网关(虚拟网桥docker0接口地址)建立连接. 如果不使用虚拟网桥,用 ...
- PAT1029.Median (25)
(一)题目 题目链接:https://www.patest.cn/contests/pat-a-practise/1029 1029. Median (25) Given an increasing ...
- 转:Centos6.5_x86安装Redis。
Redis是一个高性能的,开源key-value型数据库.是构建高性能,可扩展的Web应用的完美解决方案,可以内存存储亦可持久化存储.因为要使用跨进程,跨服务级别的数据缓存,在对比多个方案后,决定使用 ...
- Android 开发—— 小工具,大效率
欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者:姚志锋 一.Hugo插件 -- 打印方法运行时间 首先申明下,此Hugo非 彼Hugo(Hugo是由Go ...
- 学生成绩管理C语言版
[标题]学生成绩管理的设计与实现 [开发语言]C语言 [概要设计]使用结构体存储学生的学号.姓名和成绩信息,实现对学生成绩类的基本操作:增加.删除.查询.排序 [测试数据]按提示输入5组正确的正确的数 ...
- JUnit学习
很早以前就知道JUnit也知道它用来做单元测试.今天突然又想到还是要学一下这个JUnit,不然说出去不知道怎么用JUnit做单元测试……作为一个程序员怪丢人的.第一篇JUnit不算是一个总结性的文章, ...
- 求一个二维整数数组最大子数组之和,时间复杂度为N^2
本随笔只由于时间原因,我就只写写思想了 二维数组最大子数组之和,可以 引用 一维最大子数组之和 的思想一维最大子数组之和 的思想,在本博客上有,这里就不做多的介绍了 我们有一个最初的二维数组a[n ...
- Generating Sankey Diagrams from rCharts
A couple of weeks or so ago, I picked up an inlink from an OCLC blog post about Visualizing Network ...
- iOS开发之 Lottie -- 炫酷的动效
动效在软件开发中非常常见,炫酷的动画能提升应用的B格,然而由设计师的设计转化成程序猿GG的代码是个非常"痛苦"的过程.对于复杂动画,可能要花费很多时间去研究和实现.Lottie 的 ...