Display

Format

Return the formatted date string in the given format.

  1. // Moment.js
  2. moment().format('dddd, MMMM Do YYYY, h:mm:ss A');
  3. // => "Sunday, September 9th 2018, 7:12:49 PM"
  4. moment().format('ddd, hA');
  5. // => "Sun, 7PM"
  7. // date-fns
  8. import format from 'date-fns/format';
  9. format(new Date(), 'eeee, MMMM do YYYY, h:mm:ss aa');
  10. // => "Sunday, September 9th 2018, 7:12:49 PM"
  11. format(new Date(), 'eee, ha');
  12. // => "Sun, 7PM"
  14. // dayjs
  15. dayjs().format('dddd, MMMM D YYYY, h:mm:ss A');
  16. // => "Sunday, September 9 2018, 7:12:49 PM" 
  17. dayjs().format('ddd, hA');
  18. // => "Sun, 7PM"
  19. // dayjs ⚠️ requires advancedFormat plugin to support more format tokens
  20. import advancedFormat from 'dayjs/plugin/customParseFormat'
  21. dayjs.extend(advancedFormat)
  22. dayjs().format('dddd, MMMM Do YYYY, h:mm:ss A');
  23. // => "Sunday, September 9th 2018, 7:12:49 PM"
  25. // Luxon
  26. DateTime.fromMillis(time).toFormat('EEEE, MMMM dd yyyy, h:mm:ss a');
  27. // => "Sunday, September 9 2018, 7:12:49 PM" ⚠️  not support 9th
  28. DateTime.fromMillis(time).toFormat('EEE, ha');
  29. // => "Sun, 7PM"

Time from now

Return time from now.

  1. // Moment.js
  2. moment(1536484369695).fromNow();
  3. // => "4 days ago"
  5. // date-fns
  6. import formatDistance from 'date-fns/formatDistance';
  7. formatDistance(new Date(1536484369695), new Date(), { addSuffix: true });
  8. // => "4 days ago"
  10. // dayjs ⚠️ requires relativeTime plugin
  11. import relativeTime from 'dayjs/plugin/relativeTime';
  12. dayjs.extend(relativeTime);
  14. dayjs(1536484369695).fromNow();
  15. // => "5 days ago" ⚠️  the rounding method of this plugin is different from moment.js and date-fns, use with care.
  17. // luxon ❌ does not support relative time

Time from x

Return time from x.

  1. // Moment.js
  2. moment([2007, 0, 27]).to(moment([2007, 0, 29]));
  3. // => "in 2 days"
  5. // date-fns
  6. import formatDistance from 'date-fns/formatDistance';
  7. formatDistance(new Date(2007, 0, 27), new Date(2007, 0, 29));
  8. // => "2 days"
  10. // dayjs ⚠️ requires relativeTime plugin
  11. import relativeTime from 'dayjs/plugin/relativeTime';
  12. dayjs.extend(relativeTime);
  13. dayjs('2007-01-27').to(dayjs('2007-01-29'));
  14. // => "in 2 days"
  16. // luxon ❌ does not support relative time

Difference

Get the unit of time between the given dates.

  1. // Moment.js
  2. moment([2007, 0, 27]).diff(moment([2007, 0, 29]));
  3. // => -172800000
  4. moment([2007, 0, 27]).diff(moment([2007, 0, 29]), 'days');
  5. // => -2
  7. // Native
  8. new Date(2007, 0, 27) - new Date(2007, 0, 29);
  9. // => -172800000
  10. Math.ceil(
  11.   (new Date(2007, 0, 27) - new Date(2007, 0, 29)) / 1000 / 60 / 60 / 24
  12. );
  13. // => -2
  15. // date-fns
  16. import differenceInMilliseconds from 'date-fns/differenceInMilliseconds';
  17. differenceInMilliseconds(new Date(2007, 0, 27), new Date(2007, 0, 29));
  18. // => -172800000
  19. import differenceInDays from 'date-fns/differenceInDays';
  20. differenceInDays(new Date(2007, 0, 27), new Date(2007, 0, 29));
  21. // => -2
  23. // dayjs
  24. dayjs('2007-01-27').diff(dayjs('2007-01-29'), 'milliseconds');
  25. // => -172800000
  26. dayjs('2007-01-27').diff(dayjs('2007-01-29'), 'days');
  27. // => -2
  29. // luxon
  30. DateTime.local(2007, 1, 27).diff(DateTime.local(2007, 1, 29)).milliseconds;
  31. // => -172800000
  32. DateTime.local(2007, 1, 27).diff(DateTime.local(2007, 1, 29), 'days').days;
  33. // => -2