You Dont Need Momentjs

Anda tidak perlu (mungkin) membutuhkan momen.js

Moment.js adalah perpustakaan waktu & tanggal yang fantastis dengan banyak fitur dan utilitas hebat. Namun, jika Anda mengerjakan aplikasi web yang sensitif terhadap kinerja, itu mungkin menyebabkan overhead kinerja yang sangat besar karena API yang kompleks dan ukuran bundel yang besar.

Masalah dengan momen.js:

• Ini sangat didasarkan pada API OOP, yang membuatnya gagal untuk bekerja dengan goncangan pohon, sehingga mengarah ke ukuran bundel yang besar dan masalah kinerja.
• Itu bisa berubah dan menyebabkan bug:
  • klon
  • Bagaimana cara mengatasi mutabilitas di momen.js?
• API OOP yang kompleks (yang menggandakan masalah mutabilitas). Berikut adalah contohnya: https://github.com/moment/moment/blob/develever/src/test/moment/add_subtract.js#l244-l286 moment.js memungkinkan untuk menggunakan a.subtract('ms', 50) , a.subtract(50, 'ms') dan bahkan a.subtract('s', '50') .

Jika Anda tidak menggunakan zona waktu tetapi hanya beberapa fungsi sederhana dari momen.js, ini mungkin kembung aplikasi Anda, dan karenanya dianggap berlebihan. Dayjs memiliki inti yang lebih kecil dan memiliki API yang sangat mirip sehingga membuatnya sangat mudah untuk bermigrasi. Tanggal-FN memungkinkan pengocok pohon dan manfaat lainnya sehingga berfungsi dengan baik dengan React, Sinon.js, dan Webpack, dll. Lihat Momen/Momen#2373 untuk lebih banyak ide tentang mengapa dan bagaimana orang beralih dari momen.js ke solusi lain.

Perbandingan singkat

Nama	Mengguncang pohon	Metode kekayaan	Pola	Lokal	Dukungan zona waktu	Popularitas (Bintang)	Ukuran
Momen.js	TIDAK	Tinggi	Oo	123	Good (Moment-TimeZone)
Luxon	TIDAK	Tinggi	Oo	-	Good (Intl)
tanggal-fns	Ya	Tinggi	Fungsional	64	Good (Date-FNS-TZ)
dayjs	TIDAK	Tinggi	Oo	138	Good (Intl)

Suara pengembang

Momen yang dihapus.js Untuk diganti dengan tanggal -fn - Bangun output dikurangi 40%

—Jared Farago dari Webnode Project.

Perpustakaan yang bagus jika Anda ingin mengganti momen.js karena satu dan lain alasan. Immutable juga.

—Dan Abramov, penulis Redux dan rekan penulis Create React App. Membangun alat untuk manusia.

Saya sangat merekomendasikan menggunakan tanggal-fns selama momen.js, ini memiliki API yang lebih bagus dan Anda hanya dapat menyertakan bagian yang Anda butuhkan!

—Matija MarohnIć, pengembang frontend yang paham desain dari Kroasia.

Plugin Eslint

Jika Anda menggunakan ESLINT, Anda dapat menginstal plugin yang akan membantu Anda mengidentifikasi tempat -tempat di basis kode di mana Anda tidak (mungkin tidak) membutuhkan momen.js.

Instal plugin ...

npm install --save-dev eslint-plugin-you-dont-need-momentjs

... lalu perbarui konfigurasi Anda

 "extends" : [ "plugin:you-dont-need-momentjs/recommended" ] , 

Tautan cepat

Parse

1. Format String + Tanggal
2. String + Format Waktu
3. String + Format + Lokal

Dapatkan + Set

1. Milidetik/kedua/menit/jam
2. Tanggal
3. Hari dalam seminggu
4. Hari tahun
5. Minggu tahun
6. Hari ke bulan
7. Minggu demi tahun
8. Maksimal tanggal yang diberikan
9. Minimum tanggal yang diberikan

Memanipulasi

1. Menambahkan
2. Mengurangi
3. Mulai waktu
4. Akhir waktu

Menampilkan

1. Format
2. Waktu dari sekarang
3. Waktu dari x
4. Perbedaan

Pertanyaan

1. Adalah sebelumnya
2. Sama
3. Adalah setelahnya
4. Ada di antara
5. Adalah tahun kabisat
6. Adalah kencan

Paritas fitur

️ Menunjukkan paket atau pekerjaan lain diperlukan. Lihat fungsi individu di atas.

	Warga asli	Luxon	tanggal-fns	dayjs	Sementara
Parse
Format String + Tanggal	✅	✅	✅	✅	✅
String + Format Waktu	✅	✅	✅	️	✅
String + Format + Lokal		️	✅	️
Dapatkan + Set
Milidetik/kedua/menit/jam	✅	✅	✅	✅	✅
Tanggal	✅	✅	✅	✅	✅
Hari dalam seminggu	✅	✅	✅	✅	✅
Hari tahun	✅	✅	✅	✅	✅
Minggu tahun	✅	✅	✅	️	✅
Hari ke bulan	✅	✅	✅	✅	✅
Minggu demi tahun			✅	️	✅
Maksimal tanggal yang diberikan	✅	✅	✅	️	✅
Minimum tanggal yang diberikan	✅	✅	✅	️	✅
Memanipulasi
Menambahkan	✅	✅	✅	✅	✅
Mengurangi	✅	✅	✅	✅	✅
Mulai waktu		✅	✅	✅	✅
Akhir waktu	✅	✅	✅	✅	✅
Menampilkan
Format	✅	✅	✅	✅	✅
Waktu dari sekarang	✅		✅	️	✅
Waktu dari x			✅	️	✅
Perbedaan	✅	✅	✅	✅	✅
Pertanyaan
Adalah sebelumnya	✅	✅	✅	✅	✅
Sama	✅	✅	✅	✅	✅
Adalah setelahnya	✅	✅	✅	✅	✅
Ada di antara		✅	✅	️
Adalah tahun kabisat	✅	✅	✅	️	✅
Adalah kencan	✅	✅	✅	✅	✅

Parse

Format String + Tanggal

Kembalikan tanggal yang diuraikan dari string tanggal menggunakan string format yang diberikan.

 // Moment.js
moment ( '12-25-1995' , 'MM-DD-YYYY' ) ;
// => "1995-12-24T13:00:00.000Z"

// Native
const datePattern = / ^(d{2})-(d{2})-(d{4})$ / ;
const [ , month , day , year ] = datePattern . exec ( '12-25-1995' ) ;
new Date ( ` ${ month } , ${ day } ${ year } ` ) ;
// => "1995-12-24T13:00:00.000Z"

// date-fns
import parse from 'date-fns/parse' ;
parse ( '12-25-1995' , 'MM-dd-yyyy' , new Date ( ) ) ;
// => "1995-12-24T13:00:00.000Z"

// dayjs
dayjs ( '12-25-1995' ) ;
// => "1995-12-24T13:00:00.000Z"

// luxon
DateTime . fromFormat ( '12-25-1995' , 'MM-dd-yyyy' ) . toJSDate ( ) ;
// => "1995-12-24T13:00:00.000Z"

// Temporal
const datePattern = / ^(d{2})-(d{2})-(d{4})$ / ;
const [ , month , day , year ] = datePattern . exec ( '12-25-1995' ) ;
new Temporal . ZonedDateTime . from ( { year , month , day , timeZone : Temporal . Now . timeZone ( ) } ) ;
// => "1995-12-24T13:00:00.000Z"

⬆ Kembali ke atas

String + Format Waktu

Kembalikan tanggal yang diuraikan dari string waktu menggunakan string format yang diberikan.

 // Moment.js
moment ( '2010-10-20 4:30' , 'YYYY-MM-DD HH:mm' ) ;
// => "2010-10-19T17:30:00.000Z"

// Native
const datePattern = / ^(d{4})-(d{2})-(d{2})s(d{1,2}):(d{2})$ / ;
const [ , year , month , day , rawHour , min ] = datePattern . exec ( '2010-10-20 4:30' ) ;
new Date ( ` ${ year } - ${ month } - ${ day } T ${ ( '0' + rawHour ) . slice ( - 2 ) } : ${ min } :00` ) ;
// => "2010-10-19T17:30:00.000Z"

// date-fns
import parse from 'date-fns/parse' ;
parse ( '2010-10-20 4:30' , 'yyyy-MM-dd H:mm' , new Date ( ) ) ;
// => "2010-10-19T17:30:00.000Z"

// dayjs ️ requires customParseFormat plugin
import customParseFormat from 'dayjs/plugin/customParseFormat' ;
dayjs . extend ( customParseFormat ) ;
dayjs ( '2010-10-20 4:30' , 'YYYY-MM-DD HH:mm' ) ;
// => "2010-10-19T17:30:00.000Z"

// luxon
DateTime . fromFormat ( '2010-10-20 4:30' , 'yyyy-MM-dd H:mm' ) . toJSDate ( ) ;
// => "2010-10-19T17:30:00.000Z"

// Temporal
const datePattern = / ^(d{4})-(d{2})-(d{2})s(d{1,2}):(d{2})$ / ;
const [ , year , month , day , hour , minute ] = datePattern . exec ( '2010-10-20 4:30' ) ;
new Temporal . ZonedDateTime . from ( { year , month , day , hour , minute , timeZone : Temporal . Now . timeZone ( ) } ) ;
// => "2010-10-19T17:30:00.000Z"

⬆ Kembali ke atas

String + Format + Lokal

Kembalikan tanggal yang diuraikan dari string menggunakan string format dan lokal yang diberikan.

 // Moment.js
moment ( '2012 mars' , 'YYYY MMM' , 'fr' ) ;
// => "2012-02-29T13:00:00.000Z"

// date-fns
import parse from 'date-fns/parse' ;
import fr from 'date-fns/locale/fr' ;
parse ( '2012 mars' , 'yyyy MMMM' , new Date ( ) , { locale : fr } ) ;
// => "2012-02-29T13:00:00.000Z"

// dayjs ️ requires customParseFormat plugin
import customParseFormat from 'dayjs/plugin/customParseFormat' ;
import 'dayjs/locale/fr' ;
dayjs . extend ( customParseFormat ) ;
dayjs ( '2012 mars' , 'YYYY MMM' , 'fr' ) ;
// => "2012-02-29T13:00:00.000Z"

// Luxon  does not support Locale for node unless https://moment.github.io/luxon/docs/manual/install.html#node
DateTime . fromFormat ( '2012 mars' , 'yyyy MMMM' , { locale : 'fr' } ) ;
// => "2012-02-29T13:00:00.000Z"

⬆ Kembali ke atas

Dapatkan + Set

Milidetik / kedua / menit / jam

Dapatkan Millisecond/Second/Minute/Hour dari tanggal yang diberikan.

 // Moment.js
moment ( ) . seconds ( ) ;
// => 49
moment ( ) . hours ( ) ;
// => 19

// Native
new Date ( ) . getSeconds ( ) ;
// => 49
new Date ( ) . getHours ( ) ;
// => 19

// date-fns
import getSeconds from 'date-fns/getSeconds' ;
import getHours from 'date-fns/getHours' ;
getSeconds ( new Date ( ) ) ;
// => 49
getHours ( new Date ( ) ) ;
// => 19

// dayjs
dayjs ( ) . second ( ) ;
// => 49
dayjs ( ) . hour ( ) ;
// => 19

// Luxon
DateTime . local ( ) . second ;
// => 49
DateTime . local ( ) . hour ;
// => 19

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . second ;
// => 49
Temporal . Now . zonedDateTimeISO ( ) . hour ;
// => 19

Tes kinerja

Perpustakaan	Waktu
Momen	1500.703ms
Warga asli	348.411ms
Datefns	520.670ms
Dayjs	494.234ms
Luxon	1208.368ms
Sementara	-

Atur Millisecond/Second/Minute/Hour dari tanggal yang diberikan.

 // Moment.js
moment ( ) . seconds ( 30 ) ;
// => "2018-09-09T09:12:30.695Z"
moment ( ) . hours ( 13 ) ;
// => "2018-09-09T03:12:49.695Z"

// Native
new Date ( new Date ( ) . setSeconds ( 30 ) ) ;
// => "2018-09-09T09:12:30.695Z"
new Date ( new Date ( ) . setHours ( 13 ) ) ;
// => "2018-09-09T03:12:49.695Z"

// date-fns
import setSeconds from 'date-fns/setSeconds' ;
import setHours from 'date-fns/setHours' ;
setSeconds ( new Date ( ) , 30 ) ;
// => "2018-09-09T09:12:30.695Z"
setHours ( new Date ( ) , 13 ) ;
// => "2018-09-09T03:12:49.695Z"

// dayjs
dayjs ( ) . set ( 'second' , 30 ) ;
// => "2018-09-09T09:12:30.695Z"
dayjs ( ) . set ( 'hour' , 13 ) ;
// => "2018-09-09T03:12:49.695Z"

// luxon
DateTime . utc ( )
  . set ( { second : 30 } )
  . toJSDate ( ) ;
// => "2018-09-09T09:12:30.695Z"
DateTime . utc ( )
  . set ( { hour : 13 } )
  . toJSDate ( ) ;
// => "2018-09-09T03:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . with ( { second : 30 } ) ;
// => "2018-09-09T09:12:30.695Z"
Temporal . Now . zonedDateTimeISO ( ) . with ( { hour : 13 } ) ;
// => "2018-09-09T03:12:49.695Z"

Tes kinerja

Perpustakaan	Waktu
Momen	1689.744MS
Warga asli	636.741ms
Datefns	714.148ms
Dayjs	2037.603ms
Luxon	2897.571ms
Sementara	-

⬆ Kembali ke atas

Tanggal

Mendapat atau mengatur hari dalam sebulan.

 // Moment.js
moment ( ) . date ( ) ;
// => 9
moment ( ) . date ( 4 ) ;
// => "2018-09-04T09:12:49.695Z"

// Native
new Date ( ) . getDate ( ) ;
// => 9
new Date ( ) . setDate ( 4 ) ;
// => "2018-09-04T09:12:49.695Z"

// date-fns
import getDate from 'date-fns/getDate' ;
import setDate from 'date-fns/setDate' ;
getDate ( new Date ( ) ) ;
// => 9
setDate ( new Date ( ) , 4 ) ;
// => "2018-09-04T09:12:49.695Z"

// dayjs
dayjs ( ) . date ( ) ;
// => 9
dayjs ( ) . set ( 'date' , 4 ) ;
// => "2018-09-04T09:12:49.695Z"

// luxon
DateTime . utc ( ) . day ;
// => 9
DateTime . utc ( )
  . set ( { day : 4 } )
  . toString ( ) ;
// => "2018-09-04T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . day ;
// => 9
Temporal . Now . zonedDateTimeISO ( ) . with ( { day : 4 } ) ;
// => "2018-09-04T09:12:49.695Z"

Tes kinerja

Perpustakaan	Waktu
Momen	1381.669ms
Warga asli	397.415ms
Datefns	588.004ms
Dayjs	1218.025ms
Luxon	2705.606ms
Sementara	-

⬆ Kembali ke atas

Hari dalam seminggu

Mendapat atau mengatur hari dalam seminggu.

 // Moment.js
moment ( ) . day ( ) ;
// => 0 (Sunday)
moment ( ) . day ( - 14 ) ;
// => "2018-08-26T09:12:49.695Z"

// Native
new Date ( ) . getDay ( ) ;
// => 0 (Sunday)
new Date ( ) . setDate ( new Date ( ) . getDate ( ) - 14 ) ;
// => "2018-08-26T09:12:49.695Z"

// date-fns
import getDay from 'date-fns/getDay' ;
import setDay from 'date-fns/setDay' ;
getDay ( new Date ( ) ) ;
// => 0 (Sunday)
setDay ( new Date ( ) , - 14 ) ;
// => "2018-08-26T09:12:49.695Z"

// dayjs
dayjs ( ) . day ( ) ;
// => 0 (Sunday)
dayjs ( ) . set ( 'day' , - 14 ) ;
// => "2018-08-26T09:12:49.695Z"

// Luxon
DateTime . local ( ) . weekday ;
// => 7 (Sunday)
DateTime . local ( )
  . minus ( { day : 14 } )
  . toJSDate ( ) ;
// => "2018-08-26T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . dayOfWeek ;
// => 7 (Sunday)
Temporal . Now . zonedDateTimeISO ( ) . subtract ( Temporal . Duration . from ( { days : 14 } ) ) ;
// => "2018-09-04T09:12:49.695Z"

Perpustakaan	Waktu
Momen	1919.404ms
Warga asli	543.466ms
Datefns	841.436ms
Dayjs	1229.475ms
Luxon	3936.282ms
Sementara	-

⬆ Kembali ke atas

Hari tahun

Mendapat atau mengatur hari tahun ini.

 // Moment.js
moment ( ) . dayOfYear ( ) ;
// => 252
moment ( ) . dayOfYear ( 256 ) ;
// => "2018-09-13T09:12:49.695Z"

// Native
Math . floor (
  ( new Date ( ) - new Date ( new Date ( ) . getFullYear ( ) , 0 , 0 ) ) / 1000 / 60 / 60 / 24
) ;
// => 252

// date-fns
import getDayOfYear from 'date-fns/getDayOfYear' ;
import setDayOfYear from 'date-fns/setDayOfYear' ;
getDayOfYear ( new Date ( ) ) ;
// => 252
setDayOfYear ( new Date ( ) , 256 ) ;
// => "2018-09-13T09:12:49.695Z"

// dayjs ️ requires dayOfYear plugin
import dayOfYear from 'dayjs/plugin/dayOfYear' ;
dayjs . extend ( dayOfYear ) ;
dayjs ( ) . dayOfYear ( ) ;
// => 252
dayjs ( ) . dayOfYear ( 256 ) ;
// => "2018-09-13T09:12:49.695Z"

// Luxon
DateTime . local ( ) . ordinal ;
// => 252
DateTime . local ( )
  . set ( { ordinal : 256 } )
  . toString ( ) ;
// => "2018-09-13T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . dayOfYear ;
// => 252
Temporal . Now . zonedDateTimeISO ( ) . with ( { month : 1 , day : 1 } ) . add ( Temporal . Duration . from ( { days : 256 } ) ) ;
// => "2018-09-04T09:12:49.695Z"

Perpustakaan	Waktu
Momen	5511.172ms
Warga asli	530.592ms
Datefns	2079.043ms
Dayjs	-
Luxon	3540.810ms
Sementara	-

⬆ Kembali ke atas

Minggu tahun

Mendapat atau mengatur minggu dalam setahun.

 // Moment.js
moment ( ) . week ( ) ;
// => 37
moment ( ) . week ( 24 ) ;
// => "2018-06-10T09:12:49.695Z"

// date-fns
import getWeek from 'date-fns/getWeek' ;
import setWeek from 'date-fns/setWeek' ;
getWeek ( new Date ( ) ) ;
// => 37
setWeek ( new Date ( ) , 24 ) ;
// => "2018-06-10T09:12:49.695Z"

// native getWeek
const day = new Date ( ) ;
const MILLISECONDS_IN_WEEK = 604800000 ;
const firstDayOfWeek = 1 ; // monday as the first day (0 = sunday)
const startOfYear = new Date ( day . getFullYear ( ) , 0 , 1 ) ;
startOfYear . setDate (
  startOfYear . getDate ( ) + ( firstDayOfWeek - ( startOfYear . getDay ( ) % 7 ) )
) ;
const dayWeek = Math . round ( ( day - startOfYear ) / MILLISECONDS_IN_WEEK ) + 1 ;
// => 37

// native setWeek
const day = new Date ( ) ;
const week = 24 ;
const MILLISECONDS_IN_WEEK = 604800000 ;
const firstDayOfWeek = 1 ; // monday as the first day (0 = sunday)
const startOfYear = new Date ( day . getFullYear ( ) , 0 , 1 ) ;
startOfYear . setDate (
  startOfYear . getDate ( ) + ( firstDayOfWeek - ( startOfYear . getDay ( ) % 7 ) )
) ;
const dayWeek = Math . round ( ( day - startOfYear ) / MILLISECONDS_IN_WEEK ) + 1 ;
day . setDate ( day . getDate ( ) - ( dayWeek - week ) * 7 ) ;
day . toISOString ( ) ;
// => "2018-06-10T09:12:49.794Z

// dayjs ️ requires weekOfYear plugin
import weekOfYear from 'dayjs/plugin/weekOfYear' ;
dayjs . extend ( weekOfYear ) ;
dayjs ( ) . week ( ) ;
// => 37
dayjs ( ) . week ( 24 ) ;
// => "2018-06-10T09:12:49.695Z"

// Luxon
DateTime . local ( ) . weekNumber ;
// => 37
DateTime . local ( )
  . set ( { weekNumber : 23 } )
  . toString ( ) ;
// => "2018-06-10T09:12:49.794Z

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . weekOfYear ;
// => 252
Temporal . Now . zonedDateTimeISO ( ) . with ( { month : 1 , day : 1 } ) . add ( Temporal . Duration . from ( { weeks : 23 } ) ) ;
// => "2018-09-04T09:12:49.695Z"

Perpustakaan	Waktu
Momen	7147.201ms
Warga asli	1371.631ms
Datefns	5834.815ms
Dayjs	-
Luxon	4514.771ms
Sementara	-

⬆ Kembali ke atas

Hari ke bulan

Dapatkan jumlah hari di bulan ini.

 // Moment.js
moment ( '2012-02' , 'YYYY-MM' ) . daysInMonth ( ) ;
// => 29

// Native
new Date ( 2012 , 02 , 0 ) . getDate ( ) ;
// => 29

// date-fns
import getDaysInMonth from 'date-fns/getDaysInMonth' ;
getDaysInMonth ( new Date ( 2012 , 1 ) ) ;
// => 29

// dayjs
dayjs ( '2012-02' ) . daysInMonth ( ) ;
// => 29

// Luxon
DateTime . local ( 2012 , 2 ) . daysInMonth ;
// => 29

// Temporal
( new Temporal . PlainYearMonth ( 2012 , 2 ) ) . daysInMonth
// or
Temporal . PlainYearMonth . from ( '2012-02' ) . daysInMonth
// => 29

Perpustakaan	Waktu
Momen	4415.065ms
Warga asli	186.196ms
Datefns	634.084ms
Dayjs	1922.774ms
Luxon	1403.032ms
Sementara	-

⬆ Kembali ke atas

Minggu demi tahun

Mendapat jumlah minggu di tahun berjalan, menurut ISO Weeks.

 // Moment.js
moment ( ) . isoWeeksInYear ( ) ;
// => 52

// Native
const year = new Date ( ) . getFullYear ( ) ;
const MILLISECONDS_IN_WEEK = 604800000 ;
const firstMondayThisYear = new Date ( + year ,   0 , 5 - ( new Date ( + year ,   0 , 4 ) . getDay ( ) || 7 ) ) ;
const firstMondayNextYear = new Date ( + year + 1 , 0 , 5 - ( new Date ( + year + 1 , 0 , 4 ) . getDay ( ) || 7 ) ) ;
( firstMondayNextYear - firstMondayThisYear ) / MILLISECONDS_IN_WEEK ;
// => 52

// date-fns
import getISOWeeksInYear from 'date-fns/getISOWeeksInYear' ;
getISOWeeksInYear ( new Date ( ) ) ;
// => 52

// dayjs ️ requires isoWeeksInYear plugin
import isoWeeksInYear from 'dayjs/plugin/isoWeeksInYear' ;
dayjs . extend ( isoWeeksInYear ) ;
dayjs ( ) . isoWeeksInYear ( ) ;
// => 52

// Luxon
DateTime . local ( ) . weeksInWeekYear ;
// => 52

// Temporal
Temporal . PlainDate . from ( { day : 31 , month : 12 , year : Temporal . Now . plainDateISO ( ) } ) . weekOfYear
// => 52

Perpustakaan	Waktu
Momen	1065.247ms
Warga asli	-
Datefns	4954.042ms
Dayjs	-
Luxon	1134.483MS
Sementara	-

⬆ Kembali ke atas

Maksimal tanggal yang diberikan

Mengembalikan maksimum (masa depan paling jauh) dari tanggal yang diberikan.

 const array = [
  new Date ( 2017 , 4 , 13 ) ,
  new Date ( 2018 , 2 , 12 ) ,
  new Date ( 2016 , 0 , 10 ) ,
  new Date ( 2016 , 0 , 9 ) ,
] ;
// Moment.js
moment . max ( array . map ( a => moment ( a ) ) ) ;
// => "2018-03-11T13:00:00.000Z"

// Native
new Date ( Math . max . apply ( null , array ) ) . toISOString ( ) ;
// => "2018-03-11T13:00:00.000Z"

// date-fns
import max from 'date-fns/max' ;
max ( array ) ;
// => "2018-03-11T13:00:00.000Z"

// dayjs ️ requires minMax plugin
import minMax from 'dayjs/plugin/minMax' ;
dayjs . extend ( minMax ) ;
dayjs . max ( array . map ( a => dayjs ( a ) ) ) ;
// => "2018-03-11T13:00:00.000Z"

// Luxon
DateTime . max ( ... array . map ( a => DateTime . fromJSDate ( a ) ) ) . toJSDate ( ) ;
// => "2018-03-11T13:00:00.000Z"

// Temporal
Temporal . Instant . fromEpochMilliseconds ( Math . max . apply ( null , array ) )
// => "2018-03-11T13:00:00.000Z"

Perpustakaan	Waktu
Momen	1780.075ms
Warga asli	828.332ms
Datefns	980.938ms
Dayjs	-
Luxon	2694.702ms
Sementara	-

⬆ Kembali ke atas

Minimum tanggal yang diberikan

Mengembalikan minimum (masa depan yang paling jauh) dari tanggal yang diberikan.

 const array = [
  new Date ( 2017 , 4 , 13 ) ,
  new Date ( 2018 , 2 , 12 ) ,
  new Date ( 2016 , 0 , 10 ) ,
  new Date ( 2016 , 0 , 9 ) ,
] ;
// Moment.js
moment . min ( array . map ( a => moment ( a ) ) ) ;
// => "2016-01-08T13:00:00.000Z"

// Native
new Date ( Math . min . apply ( null , array ) ) . toISOString ( ) ;
// => "2016-01-08T13:00:00.000Z"

// date-fns
import min from 'date-fns/min' ;
min ( array ) ;
// => "2016-01-08T13:00:00.000Z"

// dayjs ️ requires minMax plugin
import minMax from 'dayjs/plugin/minMax' ;
dayjs . extend ( minMax ) ;
dayjs . min ( array . map ( a => dayjs ( a ) ) ) ;
// => "2016-01-08T13:00:00.000Z"

// Luxon
DateTime . min ( ... array . map ( a => DateTime . fromJSDate ( a ) ) ) . toJSDate ( ) ;
// => "2016-01-08T13:00:00.000Z"

// Temporal
Temporal . Instant . fromEpochMilliseconds ( Math . min . apply ( null , array ) )
// => "2018-03-11T13:00:00.000Z"

Perpustakaan	Waktu
Momen	1744.459ms
Warga asli	819.646ms
Datefns	841.249ms
Dayjs	-
Luxon	2720.462ms
Sementara	-

⬆ Kembali ke atas

Memanipulasi

Menambahkan

Tambahkan jumlah hari yang ditentukan ke tanggal yang diberikan.

 // Moment.js
moment ( ) . add ( 7 , 'days' ) ;
// => "2018-09-16T09:12:49.695Z"

// Native
const now = new Date ( ) ;
now . setDate ( now . getDate ( ) + 7 ) ;
// => "Sun Sep 16 2018 09:12:49"

// date-fns
import addDays from 'date-fns/addDays' ;
addDays ( new Date ( ) , 7 ) ;
// => "2018-09-16T09:12:49.695Z"

// dayjs
dayjs ( ) . add ( 7 , 'day' ) ;
// => "2018-09-16T09:12:49.695Z"

// Luxon
DateTime . local ( )
  . plus ( { day : 7 } )
  . toJSDate ( ) ;
// => "2018-09-16T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . add ( Temporal . Duration . from ( { days : 7 } ) ) ;
// => "2018-09-16T09:12:49.695Z"

Perpustakaan	Waktu
Momen	1309.485ms
Warga asli	259.932ms
Datefns	385.394ms
Dayjs	1911.881ms
Luxon	3919.797MS
Sementara	-

⬆ Kembali ke atas

Mengurangi

Kurangi jumlah hari yang ditentukan dari tanggal yang diberikan.

 // Moment.js
moment ( ) . subtract ( 7 , 'days' ) ;
// => "2018-09-02T09:12:49.695Z"

// Native
const now = new Date ( ) ;
now . setDate ( now . getDate ( ) - 7 ) ;
// => Sun Sep 09 2018 09:12:49

// date-fns
import subDays from 'date-fns/subDays' ;
subDays ( new Date ( ) , 7 ) ;
// => "2018-09-02T09:12:49.695Z"

// dayjs
dayjs ( ) . subtract ( 7 , 'day' ) ;
// => "2018-09-02T09:12:49.695Z"

// Luxon
DateTime . local ( )
  . minus ( { day : 7 } )
  . toJSDate ( ) ;
// => "2018-09-02T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . subtract ( Temporal . Duration . from ( { days : 7 } ) ) ;
// => "2018-09-02T09:12:49.695Z"

Perpustakaan	Waktu
Momen	1278.384MS
Warga asli	215.255ms
Datefns	379.057ms
Dayjs	1772.593ms
Luxon	4028.866ms
Sementara	-

⬆ Kembali ke atas

Mulai waktu

Kembalikan awal satuan waktu untuk tanggal yang diberikan.

 // Moment.js
moment ( ) . startOf ( 'month' ) ;
// => "2018-08-31T14:00:00.000Z"

// date-fns
import startOfMonth from 'date-fns/startOfMonth' ;
startOfMonth ( new Date ( ) ) ;
// => "2018-08-31T14:00:00.000Z"

// dayjs
dayjs ( ) . startOf ( 'month' ) ;
// => "2018-08-31T14:00:00.000Z"

// Luxon
DateTime . local ( ) . startOf ( 'month' ) ;
// => "2018-09-02T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . with ( { day : 1 } ) ;
// => "2018-09-01T14:00:00.000Z"

Perpustakaan	Waktu
Momen	1078.948ms
Warga asli	-
Datefns	398.107ms
Dayjs	765.358ms
Luxon	2306.765ms
Sementara	-

⬆ Kembali ke atas

Akhir waktu

Kembalikan akhir unit waktu untuk tanggal yang diberikan.

 // Moment.js
moment ( ) . endOf ( 'day' ) ;
// => "2018-09-09T13:59:59.999Z"

// Native
const end = new Date ( ) ;
end . setHours ( 23 , 59 , 59 , 999 ) ;
end . toISOString ( ) ;
// => "2018-09-09T16:59:59.999Z"

// date-fns
import endOfDay from 'date-fns/endOfDay' ;
endOfDay ( new Date ( ) ) ;
// => "2018-09-09T13:59:59.999Z"

// dayjs
dayjs ( ) . endOf ( 'day' ) ;
// => "2018-09-09T13:59:59.999Z"

// Luxon
DateTime . local ( ) . endOf ( 'day' ) ;
// => "2018-09-02T09:12:49.695Z"

// Temporal
Temporal . Now . zonedDateTimeISO ( ) . withPlainTime ( new Temporal . PlainTime ( 23 , 59 , 59 , 999 , 999 , 999 ) ) ;
// => "2018-09-09T16:59:59.999999999Z"

Perpustakaan	Waktu
Momen	1241.304ms
Warga asli	225.519ms
Datefns	319.773ms
Dayjs	914.425ms
Luxon	9920.529ms
Sementara	-

⬆ Kembali ke atas

Menampilkan

Format

Kembalikan string tanggal yang diformat dalam format yang diberikan.

 // Moment.js
moment ( ) . format ( 'dddd, MMMM Do YYYY, h:mm:ss A' ) ;
// => "Sunday, September 9th 2018, 7:12:49 PM"
moment ( ) . format ( 'ddd, hA' ) ;
// => "Sun, 7PM"

// Native
new Intl . DateTimeFormat ( 'en-US' , { dateStyle : 'full' , timeStyle : 'medium' } ) . format ( new Date ( ) )
// => "Sunday, September 9, 2018 at 7:12:49 PM"
new Intl . DateTimeFormat ( 'en-US' , { weekday : 'short' , hour : 'numeric' } ) . format ( new Date ( ) )
// => "Sun, 7 PM"

// date-fns
import { intlFormat } from 'date-fns'
intlFormat ( new Date ( ) , { dateStyle : 'full' , timeStyle : 'medium' } , { locale : 'en-US' , } )
// => "Sunday, September 9, 2018 at 7:12:49 PM"
intlFormat ( new Date ( ) , { weekday : 'short' , hour : 'numeric' } , { locale : 'en-US' , } )
// => "Sun, 7 PM"

// dayjs
dayjs ( ) . format ( 'dddd, MMMM D YYYY, h:mm:ss A' ) ;
// => "Sunday, September 9 2018, 7:12:49 PM"
dayjs ( ) . format ( 'ddd, hA' ) ;
// => "Sun, 7PM"
// dayjs ️ requires advancedFormat plugin to support more format tokens
import advancedFormat from 'dayjs/plugin/advancedFormat' ;
dayjs . extend ( advancedFormat ) ;
dayjs ( ) . format ( 'dddd, MMMM Do YYYY, h:mm:ss A' ) ;
// => "Sunday, September 9th 2018, 7:12:49 PM"

// Luxon
DateTime . fromMillis ( time ) . toFormat ( 'EEEE, MMMM dd yyyy, h:mm:ss a' ) ;
// => "Sunday, September 9 2018, 7:12:49 PM" ️  not support 9th
DateTime . fromMillis ( time ) . toFormat ( 'EEE, ha' ) ;
// => "Sun, 7PM"

// Temporal
new Intl . DateTimeFormat ( 'en-US' , { dateStyle : 'full' , timeStyle : 'medium' } ) . format ( Temporal . Now . zonedDateTimeISO ( ) )
// => "Sunday, September 9, 2018 at 7:12:49 PM"
new Intl . DateTimeFormat ( 'en-US' , { weekday : 'short' , hour : 'numeric' } ) . format ( Temporal . Now . zonedDateTimeISO ( ) )
// => "Sun, 7 PM"

⬆ Kembali ke atas

Waktu dari sekarang

Waktu kembali dari sekarang.

 // Moment.js
moment ( 1536484369695 ) . fromNow ( ) ;
// => "4 days ago"

// Native
new Intl . RelativeTimeFormat ( ) . format ( - 4 , 'day' ) ;
// => "4 days ago"

// date-fns
import formatDistance from 'date-fns/formatDistance' ;
formatDistance ( new Date ( 1536484369695 ) , new Date ( ) , { addSuffix : true } ) ;
// => "4 days ago"

// dayjs ️ requires relativeTime plugin
import relativeTime from 'dayjs/plugin/relativeTime' ;
dayjs . extend ( relativeTime ) ;

dayjs ( 1536484369695 ) . fromNow ( ) ;
// => "5 days ago" ️  the rounding method of this plugin is different from moment.js and date-fns, use with care.

// luxon requires Intl.RelativeTimeFormat
DateTime . local ( 2022 , 1 , 27 ) . toRelative ( { base : this } )
// => "in 4 months"

// Temporal
new Intl . RelativeTimeFormat ( ) . format ( - 4 , 'day' ) ;
// => "4 days ago"

⬆ Kembali ke atas

Waktu dari x

Waktu pengembalian dari x.

 // Moment.js
moment ( [ 2007 , 0 , 27 ] ) . to ( moment ( [ 2007 , 0 , 29 ] ) ) ;
// => "in 2 days"

// date-fns
import formatDistance from 'date-fns/formatDistance' ;
formatDistance ( new Date ( 2007 , 0 , 27 ) , new Date ( 2007 , 0 , 29 ) ) ;
// => "2 days"

// dayjs ️ requires relativeTime plugin
import relativeTime from 'dayjs/plugin/relativeTime' ;
dayjs . extend ( relativeTime ) ;
dayjs ( '2007-01-27' ) . to ( dayjs ( '2007-01-29' ) ) ;
// => "in 2 days"

// luxon  does not support relative time

// Temporal
Temporal . PlainDate . from ( '2007-01-27' ) . until ( '2007-01-29' ) ;
// => Temporal.Duration('P2D')

⬆ Kembali ke atas

Perbedaan

Dapatkan unit waktu antara tanggal yang diberikan.

 // Moment.js
moment ( [ 2007 , 0 , 27 ] ) . diff ( moment ( [ 2007 , 0 , 29 ] ) ) ;
// => -172800000
moment ( [ 2007 , 0 , 27 ] ) . diff ( moment ( [ 2007 , 0 , 29 ] ) , 'days' ) ;
// => -2

// Native
new Date ( 2007 , 0 , 27 ) - new Date ( 2007 , 0 , 29 ) ;
// => -172800000
Math . ceil (
  ( new Date ( 2007 , 0 , 27 ) - new Date ( 2007 , 0 , 29 ) ) / 1000 / 60 / 60 / 24
) ;
// => -2

// date-fns
import differenceInMilliseconds from 'date-fns/differenceInMilliseconds' ;
differenceInMilliseconds ( new Date ( 2007 , 0 , 27 ) , new Date ( 2007 , 0 , 29 ) ) ;
// => -172800000
import differenceInDays from 'date-fns/differenceInDays' ;
differenceInDays ( new Date ( 2007 , 0 , 27 ) , new Date ( 2007 , 0 , 29 ) ) ;
// => -2

// dayjs
dayjs ( '2007-01-27' ) . diff ( dayjs ( '2007-01-29' ) , 'milliseconds' ) ;
// => -172800000
dayjs ( '2007-01-27' ) . diff ( dayjs ( '2007-01-29' ) , 'days' ) ;
// => -2

// luxon
DateTime . local ( 2007 , 1 , 27 ) . diff ( DateTime . local ( 2007 , 1 , 29 ) ) . milliseconds ;
// => -172800000
DateTime . local ( 2007 , 1 , 27 ) . diff ( DateTime . local ( 2007 , 1 , 29 ) , 'days' ) . days ;
// => -2

// Temporal
Temporal . PlainDate . from ( '2007-01-27' ) . since ( '2007-01-29' ) . total ( { unit : 'millisecond' } ) ;
// => -172800000
Temporal . PlainDate . from ( '2007-01-27' ) . since ( '2007-01-29' ) . total ( { unit : 'day' } ) ;
// => -2

⬆ Kembali ke atas

Pertanyaan

Adalah sebelumnya

Periksa apakah tanggal sebelum tanggal lain.

 // Moment.js
moment ( '2010-10-20' ) . isBefore ( '2010-10-21' ) ;
// => true

// Native
new Date ( 2010 , 10 , 20 ) < new Date ( 2010 , 10 , 21 ) ;
// => true

// date-fns
import isBefore from 'date-fns/isBefore' ;
isBefore ( new Date ( 2010 , 9 , 20 ) , new Date ( 2010 , 9 , 21 ) ) ;
// => true

// dayjs
dayjs ( '2010-10-20' ) . isBefore ( '2010-10-21' ) ;
// => true

// luxon
DateTime . fromISO ( '2010-10-20' ) < DateTime . fromISO ( '2010-10-21' ) ;
// => true

// Temporal
Temporal . PlainDate . compare ( '2010-10-20' , '2010-10-21' ) === - 1 ;
// => true

⬆ Kembali ke atas

Sama

Periksa apakah tanggal sama dengan tanggal lain.

 // Moment.js
moment ( '2010-10-20' ) . isSame ( '2010-10-21' ) ;
// => false
moment ( '2010-10-20' ) . isSame ( '2010-10-20' ) ;
// => true
moment ( '2010-10-20' ) . isSame ( '2010-10-21' , 'month' ) ;
// => true

// Native
new Date ( 2010 , 9 , 20 ) . valueOf ( ) === new Date ( 2010 , 9 , 21 ) . valueOf ( ) ;
// => false
new Date ( 2010 , 9 , 20 ) . valueOf ( ) === new Date ( 2010 , 9 , 20 ) . valueOf ( ) ;
// => true
new Date ( 2010 , 9 , 20 ) . getTime ( ) === new Date ( 2010 , 9 , 20 ) . getTime ( ) ;
// => true
new Date ( 2010 , 9 , 20 ) . valueOf ( ) === new Date ( 2010 , 9 , 20 ) . getTime ( ) ;
// => true
new Date ( 2010 , 9 , 20 ) . toDateString ( ) . substring ( 4 , 7 ) ===
  new Date ( 2010 , 9 , 21 ) . toDateString ( ) . substring ( 4 , 7 ) ;
// => true

// date-fns
import isSameDay from 'date-fns/isSameDay' ;
import isSameMonth from 'date-fns/isSameMonth' ;
isSameDay ( new Date ( 2010 , 9 , 20 ) , new Date ( 2010 , 9 , 21 ) ) ;
// => false
isSameDay ( new Date ( 2010 , 9 , 20 ) , new Date ( 2010 , 9 , 20 ) ) ;
// => true
isSameMonth ( new Date ( 2010 , 9 , 20 ) , new Date ( 2010 , 9 , 21 ) ) ;
// => true

// dayjs
dayjs ( '2010-10-20' ) . isSame ( '2010-10-21' ) ;
// => false
dayjs ( '2010-10-20' ) . isSame ( '2010-10-20' ) ;
// => true
dayjs ( '2010-10-20' ) . isSame ( '2010-10-21' , 'month' ) ;
// => true

// luxon
( + DateTime . fromISO ( '2010-10-20' ) ===
  + DateTime . fromISO ( '2010-10-21' ) +
    // => false
    DateTime . fromISO ( '2010-10-20' ) ) ===
  + DateTime . fromISO ( '2010-10-20' ) ;
// => true
DateTime . fromISO ( '2010-10-20' ) . hasSame ( DateTime . fromISO ( '2010-10-21' ) , 'month' ) ;
// => true

// Temporal
Temporal . PlainDate . from ( '2010-10-20' ) . equals ( '2010-10-21' ) ;
// => false
Temporal . PlainDate . from ( '2010-10-20' ) . equals ( '2010-10-20' ) ;
// => true
Temporal . PlainDate . from ( '2010-10-20' ) . month === Temporal . PlainDate . from ( '2010-10-21' ) . month ;
// => true

⬆ Kembali ke atas

Adalah setelahnya

Periksa apakah tanggal setelah tanggal lain.

 // Moment.js
moment ( '2010-10-20' ) . isAfter ( '2010-10-19' ) ;
// => true

// Native
new Date ( 2010 , 9 , 20 ) > new Date ( 2010 , 9 , 19 ) ;
// => true

// date-fns
import isAfter from 'date-fns/isAfter' ;
isAfter ( new Date ( 2010 , 9 , 20 ) , new Date ( 2010 , 9 , 19 ) ) ;
// => true

// dayjs
dayjs ( '2010-10-20' ) . isAfter ( '2010-10-19' ) ;
// => true

// luxon
DateTime . fromISO ( '2010-10-20' ) > DateTime . fromISO ( '2010-10-19' ) ;
// => true

// Temporal
Temporal . PlainDate . compare ( '2010-10-20' , '2010-10-19' ) === 1 ;
// => true

⬆ Kembali ke atas

Ada di antara

Periksa apakah tanggal antara dua tanggal lainnya.

 // Moment.js
moment ( '2010-10-20' ) . isBetween ( '2010-10-19' , '2010-10-25' ) ;
// => true

// date-fns
import isWithinInterval from 'date-fns/isWithinInterval' ;
isWithinInterval ( new Date ( 2010 , 9 , 20 ) , {
  start : new Date ( 2010 , 9 , 19 ) ,
  end : new Date ( 2010 , 9 , 25 ) ,
} ) ;
// => true

// dayjs ️ requires isBetween plugin
import isBetween from 'dayjs/plugin/isBetween' ;
dayjs . extend ( isBetween ) ;
dayjs ( '2010-10-20' ) . isBetween ( '2010-10-19' , '2010-10-25' ) ;
// => true

// luxon
Interval . fromDateTimes (
  DateTime . fromISO ( '2010-10-19' ) ,
  DateTime . fromISO ( '2010-10-25' )
) . contains ( DateTime . fromISO ( '2010-10-20' ) ) ;
// => true

⬆ Kembali ke atas

Adalah tahun kabisat

Periksa apakah setahun adalah tahun kabisat.

 // Moment.js
moment ( [ 2000 ] ) . isLeapYear ( ) ;
// => true

// Native
new Date ( 2000 , 1 , 29 ) . getDate ( ) === 29 ;
// => true

// date-fns
import isLeapYear from 'date-fns/isLeapYear' ;
isLeapYear ( new Date ( 2000 , 0 , 1 ) ) ;
// => true

// dayjs ️ requires isLeapYear plugin
import isLeapYear from 'dayjs/plugin/isLeapYear' ;
dayjs . extend ( isLeapYear ) ;
dayjs ( '2000-01-01' ) . isLeapYear ( ) ;
// => true

// luxon
expect ( DateTime . local ( 2000 ) . isInLeapYear ) . toBeTruthy ( ) ;
// => true

// Temporal
Temporal . PlainDate . from ( '2000-01-01' ) . inLeapYear ;
// => true

⬆ Kembali ke atas

Adalah kencan

Periksa apakah suatu variabel adalah objek tanggal JS asli.

 // Moment.js
moment . isDate ( new Date ( ) ) ;
// => true

// Native
new Date ( ) instanceof Date ;
// => true

// date-fns
import isDate from 'date-fns/isDate' ;
isDate ( new Date ( ) ) ;
// => true

// dayjs
dayjs ( new Date ( ) ) . isValid ( ) ;

// luxon
DateTime . local ( ) . isValid ;
// => true

// Temporal
new Date ( ) instanceof Date ;
Temporal . Now . plainTimeISO ( ) instanceof Temporal . PlainTime ;
Temporal . Now . plainDateISO ( ) instanceof Temporal . PlainDate ;
Temporal . Now . plainDateTimeISO ( ) instanceof Temporal . PlainDateTime ;
Temporal . Now . zonedDateTimeISO ( ) instanceof Temporal . ZonedDateTime ;
// => true

⬆ Kembali ke atas

Lisensi

Mit