Jump to content

JavaScript 'time ago' function

Posted in JavaScript · 2 minutes read

Snippet for a rather popular requirement. Formatting a date in a nice way, using infamous "time ago" function. This is the basic version which I adapt to fit a specific project. To keep it easily customizable to your needs, I haven't packaged it up.

Just pass a date to it, and function will return one of the seven possible formats:

  • now - if no more than five seconds elapsed
  • about a minute ago - in no more than ninety seconds elapsed
  • 24 minutes ago - for anything in the last hour
  • Today at 11:19 - for today
  • Yesterday at 7:32 - for yesterday
  • 15. February at 17:45 - for dates in the current year
  • 23. October 2017. at 0:59 - for anything else

Feel free to play with it and add more cases if you need them.

Code #

const MONTH_NAMES = [
  'January', 'February', 'March', 'April', 'May', 'June',
  'July', 'August', 'September', 'October', 'November', 'December'
];


function getFormattedDate(date, prefomattedDate = false, hideYear = false) {
  const day = date.getDate();
  const month = MONTH_NAMES[date.getMonth()];
  const year = date.getFullYear();
  const hours = date.getHours();
  let minutes = date.getMinutes();

  if (minutes < 10) {
    // Adding leading zero to minutes
    minutes = `0${ minutes }`;
  }

  if (prefomattedDate) {
    // Today at 10:20
    // Yesterday at 10:20
    return `${ prefomattedDate } at ${ hours }:${ minutes }`;
  }

  if (hideYear) {
    // 10. January at 10:20
    return `${ day }. ${ month } at ${ hours }:${ minutes }`;
  }

  // 10. January 2017. at 10:20
  return `${ day }. ${ month } ${ year }. at ${ hours }:${ minutes }`;
}


// --- Main function
function timeAgo(dateParam) {
  if (!dateParam) {
    return null;
  }

  const date = typeof dateParam === 'object' ? dateParam : new Date(dateParam);
  const DAY_IN_MS = 86400000; // 24 * 60 * 60 * 1000
  const today = new Date();
  const yesterday = new Date(today - DAY_IN_MS);
  const seconds = Math.round((today - date) / 1000);
  const minutes = Math.round(seconds / 60);
  const isToday = today.toDateString() === date.toDateString();
  const isYesterday = yesterday.toDateString() === date.toDateString();
  const isThisYear = today.getFullYear() === date.getFullYear();


  if (seconds < 5) {
    return 'now';
  } else if (seconds < 60) {
    return `${ seconds } seconds ago`;
  } else if (seconds < 90) {
    return 'about a minute ago';
  } else if (minutes < 60) {
    return `${ minutes } minutes ago`;
  } else if (isToday) {
    return getFormattedDate(date, 'Today'); // Today at 10:20
  } else if (isYesterday) {
    return getFormattedDate(date, 'Yesterday'); // Yesterday at 10:20
  } else if (isThisYear) {
    return getFormattedDate(date, false, true); // 10. January at 10:20
  }

  return getFormattedDate(date); // 10. January 2017. at 10:20
}

Demo #

Update, August 2020

Comments (8)

22. August 2020
Stanko

Thanks guys!

elijah, I just created a demo on Codepen, I added it at the bottom of the post. Hope that helps!

Cheers!

22. August 2020
elijah

i am getting an error that timeAgo is not a function

22. August 2020
kamaucardozo

thanks very much

4. July 2020
pravynandas

Works Great !! Khudos.

30. May 2020
Stanko

McAustin, it seems your comment got cut off. Can you please provide a test case that didn't work? And the solution if you figured it out.

Cheers!

30. May 2020
McAustin

it didn't work for me saying today @ particular time frame,

5. November 2019
Burak

Thanks buddy. you saved my hours

4. January 2019
Achim

Hi, thank you. It saved me some time. I wrote a query function to automatically update the dates:

[code removed]