这个是个小方法很简单但是我们在开发项目中这样的我必不可少
接下来我们说下我们的相关效果就想这个力扣的话就有这个的效果
上面会显示我们的在何时发布的文章的时间
接下来我们看看我们要如何入手话不多说我们直接看代码
// 时间格式化成秒 分钟 小时 前
const formatDate = (value) => {
const time = Date.now() - new Date(value)
/*
1秒 1000
1分钟 1000 * 60 60000
1小时 1000 * 60 * 60 3600000
1天 1000 * 60 * 60 * 24 86400000
1个月 1000 * 60 * 60 * 24 * 30 2592000000
1年 1000 * 60 * 60 * 24 * 365 31536000000
*/
const times = [31536000000, 2592000000, 86400000, 3600000, 60000, 1000]
const units = ['年前', '月前', '天前', '小时前', '分钟前', '秒前']
for (let i = 0; i < times.length; i++) {
const res = time / times[i]
if (res >= 1) {
return Math.round(res) + units[i]
}
}
}
里面的代码如果有不清楚的可以看下面的解析(上面的代码我们直接就可以在我们的js中运行)
我们的第一步是先封装了一个函数这个函数里的参数就是我们用户发布的时间(第一步)
// 时间格式化成秒 分钟 小时 前
const formatDate = (value) => {
}
我们先用一个常量接收我们的当前时间减去我们传入的时间 ,这样的话我们就可以求出我们的的发布时间是多久之前了,我们要理解我们这个格式化的意义在我们如何得出我们用户多久前发布的文章(第二步)
// 时间格式化成秒 分钟 小时 前
const formatDate = (value) => {
这个是我们要求出的用户多久之前发布的文章
const time = Date.now() - new Date(value)
}
这个是我们的这个代码的核心思想就是我们计算我们的用户多久之前发布的文章(第三步)
我们先要理解我们的时间的规律,我们的一毫秒等于1000毫秒,我们的一分钟等于60000毫秒依次类推下面代码中有我计算好的时间的规律可以好好的看看。
然后的话我们定义2个数组里面分别放着我们的毫秒的是时间,
另一个的话我们放的是我们的年前和月前等等是要和我们的毫秒数一一对应的
// 时间格式化成秒 分钟 小时 前
const formatDate = (value) => {
求出用户多久发布的文章
const time = Date.now() - new Date(value)
因为我们得到的是一个毫秒数所以我们要找到我们的的时间的规律
/*
1秒 1000
1分钟 1000 * 60 60000
1小时 1000 * 60 * 60 3600000
1天 1000 * 60 * 60 * 24 86400000
1个月 1000 * 60 * 60 * 24 * 30 2592000000
1年 1000 * 60 * 60 * 24 * 365 31536000000
*/
const times = [31536000000, 2592000000, 86400000, 3600000, 60000, 1000]
const units = ['年前', '月前', '天前', '小时前', '分钟前', '秒前']
}
这个是我们的最后一步(第四步)
我们用一个循环去遍历我们的数组
然后我们用我们得到多久前的时间去除于我们计算好的一年里时间去判断我们用户发布时间在什么范(在年前还是月前或是天前)
// 时间格式化成秒 分钟 小时 前
const formatDate = (value) => {
const time = Date.now() - new Date(value)
/*
1秒 1000
1分钟 1000 * 60 60000
1小时 1000 * 60 * 60 3600000
1天 1000 * 60 * 60 * 24 86400000
1个月 1000 * 60 * 60 * 24 * 30 2592000000
1年 1000 * 60 * 60 * 24 * 365 31536000000
*/
const times = [31536000000, 2592000000, 86400000, 3600000, 60000, 1000]
const units = ['年前', '月前', '天前', '小时前', '分钟前', '秒前']
for (let i = 0; i < times.length; i++) {
这个是我们用我们得到多久前的时间去除于我们计算好的一年地时间去判断我们发布时间在什么范围(在年前还是月前或是天前)
const res = time / times[i]
if (res >= 1) {
return Math.round(res) + units[i]
Math.round的作用是四舍五如取整,units[i]的意思是我们显示是那个时间范围前
}
}
}
这样的话我们就可以达到我们前面想要的效果了‘