格式化釋出時間

老毛發表於2022-04-17
最近有個需求，把文章或者評論的釋出時間轉換成，剛剛，10分鐘前....，這種表示方式，如下：

IICOOM格式化過去時間

JavaScript格式化時間

/**
 * 格式化 已經過去的時間
 * @param {*} value 時間戳(ms) 或時間物件
 * @returns 
 */
function elapsed(value) {

    const time = Date.now() - new Date(value)

    const times = [31536000000, 2592000000, 86400000, 3600000, 60000, 1000] 
    const units = ['年前', '月前', '天前', '小時前', '分鐘前', '秒前']

    let index = times.findIndex(t => t < time)

    return Math.round(time/times[index]) + units[index]
}

console.log(elapsed(1649743490030))
// 14秒前

通過上面的方法，初步實現了。但是感覺還是units處理過於死板，後續需要參考其他網站做下優化。

改進

上邊的units我們其實可以把'秒前'改為'剛剛'，即小於1分鐘的表示為剛剛，而大於一天的直接展示日期：

/**
 * 格式化 已經過去的時間
 * @param {*} value 時間戳(ms) 或時間物件
 * @returns 
 */
function elapsed(value) {
    const time = Date.now() - new Date(value)
    const times = [3600000, 60000, 1000]
    const units = [' 小時前', ' 分鐘前', ' 剛剛']
    if (time > 86400000) {
      return globalFunction.format(value, 'YYYY-MM-DD HH:mm')
    } else {
      let index = times.findIndex(t => t < time)
      return [-1,2].includes(index)?units[2]:Math.round(time/times[index]) + units[index]
    }
}

/**
 * 13位時間戳
 * @param {*} value 
 * @returns 
 */
function format(value, format) {
    let date = new Date(value);
    let year = date.getFullYear();
    let month = ("0" + (date.getMonth() + 1)).slice(-2);
    let day = ("0" + date.getDate()).slice(-2);
    let hour = ("0" + date.getHours()).slice(-2);
    let minute = ("0" + date.getMinutes()).slice(-2);
    let second = ("0" + date.getSeconds()).slice(-2);
    // 拼接
    if (!format) {
      return year + "-"+ month +"-"+ day +" "+ hour +":"+ minute+":"+second;
    }
    if (format === 'YYYY-MM-DD HH:mm') {
      return year + "-"+ month +"-"+ day +" "+ hour +":"+ minute;
    }
}

這樣，看起來就合理了很多。

相關文章