Objek Date memungkinkan Anda untuk bekerja dengan tanggal dan waktu. Sintaks berikut digunakan untuk membuat objek Date baru:
Tanggal Baru ()
Ini menyimpan tanggal sebagai jumlah milidetik sejak tengah malam, 1 Januari 1970, menurut waktu universal (UTC). Dengan format ini, Tanggal dapat secara akurat mewakili tanggal 285616 tahun dari 1 Januari 1970.
Jika konstruktor Tanggal dipanggil tanpa argumen, sebuah objek dibuat dengan nilai tanggal dan waktu saat ini. Untuk membuat objek Date dengan tanggal atau waktu tertentu, Anda harus melewati salah satu dari empat parameter yang mungkin:
- milidetik: nilai harus berupa jumlah milidetik sejak 01.01.1970 var birthDate = new Date (8298400000); document.write (tanggal lahir);
- string tanggal: tanggal apa pun dalam format yang didukung oleh metode parse () var birthDate = new Date ("April 16, 1975"); document.write (tanggal lahir);
- tahun, bulan, hari var tanggal lahir = Tanggal baru (1975, 4, 28); document.write (tanggal lahir);
Harap dicatat bahwa angka 4 sesuai dengan bulan Mei. Ini berarti angka 0 sesuai dengan Januari, hari-hari dihitung dengan cara yang sama, hanya nol dalam hal ini yang sesuai dengan hari Minggu.
- tahun, bulan, hari, jam, menit, detik, milidetik
Saat bekerja dengan objek Tanggal, penting untuk diingat bahwa perhitungan dilakukan menggunakan Waktu Universal Terkoordinasi (UTC), meskipun komputer Anda mungkin menampilkan waktu menurut zona waktu Anda.
Metode
| metode | Keterangan |
|---|---|
| getDate() | Mengembalikan hari dalam sebulan (1 hingga 31) untuk tanggal yang ditentukan, waktu setempat. |
| dapatkan hari () | Mengembalikan hari dalam seminggu (0 hingga 6; 0 = Minggu, 1 = Senin, dll.) untuk tanggal yang ditentukan, waktu setempat. |
| dapatkanSetahun Penuh() | Mengembalikan tahun (empat digit). |
| dapatkanJam () | Mengembalikan jam (0 hingga 23). |
| getMilliseconds () | Mengembalikan milidetik (0 hingga 999). |
| getMinutes () | Mengembalikan menit (0 hingga 59). |
| dapatkanBulan() | Mengembalikan bulan (0 hingga 11; 0 = Januari, 1 = Februari, dll.). |
| getSeconds () | Mengembalikan detik (dari 0 hingga 59). |
| dapatkan Waktu () | Mengembalikan jumlah milidetik sejak tengah malam 01/01/1970. |
| getTimezoneOffset () | Mengembalikan perbedaan waktu antara waktu UTC dan lokal, dalam menit. |
| dapatkanUTCDate() | Mengembalikan hari dalam bulan UTC (1 sampai 31). |
| dapatkanUTCDday () | Mengembalikan hari dalam seminggu menurut waktu universal (0 hingga 6). |
| getUTCFullYear() | Mengembalikan tahun UTC (empat digit). |
| dapatkanUTCHours () | Mengembalikan jam UTC (0 hingga 23). |
| getUTCMillidetik () | Mengembalikan milidetik UTC (0 hingga 999). |
| getUTCMinutes () | Mengembalikan menit dalam UTC (0 hingga 59). |
| dapatkanUTCMonth() | Mengembalikan bulan dalam UTC (0 hingga 11). |
| getUTCSeconds () | Mengembalikan detik dalam UTC (0 hingga 59). |
| mengurai () | Mengurai string tanggal (misalnya, "21 Mei 1992") dan mengembalikan string tanggal yang berisi angka dalam milidetik sejak 1 Januari 1970 00:00:00. |
| Atur tanggal () | Menetapkan hari dalam sebulan untuk tanggal yang ditentukan, waktu setempat (1 hingga 31). |
| setFullTahun () | Mengatur tahun (empat digit). |
| setJam () | Mengatur jam untuk tanggal yang ditentukan menurut waktu setempat (0 hingga 23). |
| setMillidetik () | Menyetel milidetik untuk tanggal yang ditentukan, waktu setempat. |
| setMenit () | Mengatur menit (0 hingga 59). |
| setBulan() | Mengatur bulan (0 hingga 11). |
| setdetik () | Mengatur detik (0 hingga 59). |
| Atur waktu () | Menyetel tanggal dalam milidetik setelah (atau sebelum) 01/01/1970. |
| setUTCDate() | Menentukan hari dalam sebulan. |
| setUTCFullYear() | Mengatur tahun menurut waktu universal (empat digit). |
| setUTCHours () | Menyetel jam untuk tanggal yang ditentukan, UTC. |
| setUTCMillidetik () | Menyetel milidetik untuk tanggal yang ditentukan, UTC. |
| setUTCMinutes () | Menyetel menit untuk tanggal yang ditentukan, UTC. |
| setUTCMbulan() | Menyetel bulan untuk tanggal yang ditentukan, UTC. |
| setUTCSeconds () | Menyetel detik untuk tanggal yang ditentukan, UTC. |
| toDateString () | |
| keISOSstring () | Mengonversi tanggal menjadi string menggunakan standar ISO 8601. |
| ke JSON () | Mengembalikan tanggal sebagai string, diformat sebagai tanggal JSON. |
| toLocaleDateString () | |
| toLocaleTimeString () | Mengembalikan bagian tanggal sebagai string, dengan representasi tanggal berdasarkan parameter sistem. |
| toLocaleString () | Mengembalikan tanggal sebagai string, dengan representasi tanggal berdasarkan parameter sistem. |
| toString() | Mengembalikan string yang mewakili objek Tanggal yang ditentukan. |
| toTimeString () | Mengembalikan bagian dari tanggal sebagai string. |
| keUTCString () | Mengonversi tanggal menjadi string menggunakan zona waktu UTC. |
| UTC () | Mengambil parameter yang sama dengan bentuk panjang konstruktor (yaitu 2-7) dan mengembalikan jumlah milidetik sejak 1 Januari 1970, 00:00:00 UTC. |
| Nilai dari () | Mengembalikan nilai primitif dari objek Date. |
Tanggal dan waktu adalah bagian dari kami Kehidupan sehari-hari dan karena itu menonjol dalam pemrograman. Di JavaScript, saat membuat situs web, Anda mungkin ingin menambahkan kalender, jadwal kereta, atau antarmuka untuk menjadwalkan janji temu. Aplikasi ini harus menampilkan titik waktu yang sesuai berdasarkan zona waktu pengguna saat ini, atau melakukan perhitungan terkait kedatangan dan keberangkatan pesawat atau waktu mulai dan berakhirnya suatu peristiwa. Juga, Anda mungkin perlu menggunakan JavaScript untuk mengirim laporan harian ke Waktu tertentu atau untuk penyaringan (misalnya, untuk mencari restoran yang buka pada waktu tertentu).
Objek tanggal
Tanggal sebaris objek JavaScript yang menyimpan tanggal dan waktu. Ini menyediakan sejumlah metode bawaan untuk memformat dan memanipulasi data ini.
Secara default, instance Date baru tanpa argumen membuat objek dengan tanggal dan waktu saat ini sesuai dengan pengaturan sistem komputer saat ini.
Misalnya, coba tetapkan tanggal saat ini ke variabel. Buat file sekarang.js.
// Setel variabel ke tanggal dan waktu saat ini
const sekarang = Tanggal baru ();
// Lihat outputnya
sekarang;
Rabu 18 Okt 2017 12:41:34 GMT + 0000 (UTC)
Outputnya adalah string dengan tanggal yang berisi data berikut:
Tanggal dan waktu dipecah dan ditampilkan dengan cara yang dapat dibaca.
Namun, JavaScript menafsirkan tanggal dalam bentuk stempel waktu Unix, yang merupakan nilai yang terdiri dari jumlah milidetik sejak tengah malam 1 Januari 1970. Anda bisa mendapatkan stempel waktu menggunakan metode getTime ().
// Dapatkan stempel waktu saat ini
sekarang.getWaktu();
1508330494000
Angka besar yang muncul di output sebagai stempel waktu saat ini mewakili jumlah milidetik yang telah berlalu dari tengah malam 1 Januari 1970 hingga 18 Oktober 2017.
Waktu nol (atau waktu epoch) diwakili oleh string tanggal 01 Januari 1970 00:00:00 Waktu Universal (UTC) dan stempel waktu 0. Anda dapat mengujinya di browser dengan membuat variabel baru di file epoch.js dan menetapkan instance Tanggal baru untuk itu berdasarkan cap waktu 0.
// Tetapkan stempel waktu 0 ke variabel baru
const epochTime = Tanggal baru (0);
zamanWaktu;
01 Januari 1970 00:00:00 Waktu Universal (UTC)
Waktu nol dipilih sebagai standar untuk mengukur waktu oleh komputer, dan metode ini digunakan dalam JavaScript. Penting untuk memahami cap waktu dan string tanggal karena konsep ini dapat digunakan tergantung pada pengaturan dan tujuan aplikasi.
Sekarang Anda tahu cara membuat instance Date baru berdasarkan waktu saat ini dan berdasarkan stempel waktu. Ada total empat format Tanggal dalam JavaScript. Selain waktu dan stempel waktu default saat ini, Anda juga dapat menggunakan string tanggal atau menentukan tanggal dan waktu tertentu.
Untuk menunjukkan cara yang berbeda mengacu pada tanggal tertentu, coba buat objek Date baru yang mewakili 4 Juli 1776, 12:30 GMT dalam tiga cara berbeda.
// Metode stempel waktu
Tanggal baru (-610601580000);
// Metode string tanggal
Tanggal baru ("31 Januari 1980 12:30");
// Metode tanggal dan waktu
Tanggal baru (1776, 6, 4, 12, 30, 0, 0);
Semua contoh ini menyajikan informasi tanggal dan waktu yang sama dalam tiga cara berbeda.
Seperti yang Anda lihat, metode timestamp memiliki angka negatif; setiap tanggal sebelum waktu nol akan direpresentasikan sebagai angka negatif.
Pada contoh ketiga, detik dan milidetik diwakili oleh 0. Jika Anda kehilangan data apa pun saat membuat objek Tanggal, Anda harus menyetelnya ke 0. Data yang hilang tidak dapat dilewati karena urutan data waktu dalam string tidak mengubah. Perlu juga dicatat bahwa bulan Juli ditetapkan di sini sebagai 6, bukan 7. Ini karena hitungan mundur tidak dimulai dari 1, tetapi dari 0. Lebih lanjut tentang ini di bagian selanjutnya.
Mengambil tanggal menggunakan get
Setelah Anda memiliki tanggal, Anda dapat mengakses semua komponennya menggunakan berbagai metode bawaan. Metode mengembalikan setiap bagian dari tanggal relatif terhadap zona waktu lokal. Masing-masing metode ini dimulai dengan mendapatkan dan mengembalikan nomor relatif. Di bawah ini adalah tabel detail metode get untuk objek Date.
| Tanggal Waktu | metode | Jangkauan | Contoh |
| Tahun | dapatkanSetahun Penuh() | YYYY | 1970 |
| Bulan | dapatkanBulan() | 0-11 | 0 = Januari |
| Hari dalam sebulan | getDate() | 1-31 | 1 = tanggal 1 setiap bulan |
| Hari dalam seminggu | dapatkan hari () | 0-6 | 0 = Minggu |
| Jam | dapatkanJam () | 0-23 | 0 = tengah malam |
| Menit | getMinutes () | 0-59 | |
| Kedua | getSeconds () | 0-59 | |
| Mili detik | getMilliseconds () | 0-999 | |
| Stempel waktu | dapatkan Waktu () |
// Inisialisasi instance ulang tahun baru
const ulang tahun = Tanggal baru (1980, 6, 31);
Semua metode sekarang dapat digunakan untuk mengambil setiap komponen tanggal.
birthday.getFullYear(); // 1980
ulang tahun.getBulan(); // 6
ulang tahun.getDate(); // 31
ulang tahun.getDay(); // 4
ulang tahun.getHours(); // 0
ulang tahun.getMinutes(); // 0
ulang tahun.getSeconds(); // 0
ulang tahun.getMillidetik (); // 0
ulang tahun.getTime(); // 333849600000 (untuk GMT)
Terkadang Anda hanya perlu mengekstrak sebagian tanggal, dan metode get bawaan akan membantu Anda melakukannya.
Misalnya, Anda dapat membandingkan tanggal saat ini dengan tanggal 3 Oktober untuk mengetahui apakah tanggal 3 Oktober atau tidak.
// Dapatkan "tanggal" hari ini
const hari ini = Tanggal baru ();
// Bandingkan hari ini dengan 3 Oktober
if (today.getDate () === 3 && today.getMonth () === 9) (
console.log ("Ini" 3 Oktober. ");
) lain (
console.log ("Ini bukan 3 Oktober.");
}
Ini bukan 3 Oktober.
Metode get bawaan memungkinkan Anda mengakses komponen tanggal.
Mengubah tanggal dengan set
Semua getter di atas memiliki setter yang sesuai. Jika get digunakan untuk mengambil komponen tertentu dari suatu tanggal, set digunakan untuk mengubah komponen tersebut. Di bawah ini adalah tabel terperinci dari metode yang ditetapkan untuk objek Date.
| Tanggal Waktu | metode | Jangkauan | Contoh |
| Tahun | setFullTahun () | YYYY | 1970 |
| Bulan | setBulan() | 0-11 | 0 = Januari |
| Hari dalam sebulan | Atur tanggal () | 1-31 | 1 = tanggal 1 setiap bulan |
| Hari dalam seminggu | setHari () | 0-6 | 0 = Minggu |
| Jam | setJam () | 0-23 | 0 = tengah malam |
| Menit | setMenit () | 0-59 | |
| Kedua | setdetik () | 0-59 | |
| Mili detik | setMillidetik () | 0-999 | |
| Stempel waktu | Atur waktu () | Jumlah milidetik sejak nol waktu |
Setter ini dapat digunakan untuk mengubah satu atau lebih komponen tanggal. Misalnya, Anda dapat mengubah tahun dalam variabel ulang tahun menjadi 1997.
// Ubah tahun tanggal ulang tahun
birthday.setFullYear (1997);
hari ulang tahun;
Kamis 31 Juli 1997 00:00:00 GMT + 0000 (UTC)
Sekarang, ketika Anda memanggil variabel ulang tahun, Anda tidak melihat 1980, tetapi 1997.
Metode penyetel bawaan memungkinkan Anda memodifikasi bagian berbeda dari objek Tanggal.
metode UTC
Metode get di atas mengambil komponen tanggal berdasarkan pengaturan lokal zona waktu pengguna. Untuk meningkatkan kontrol atas tanggal dan waktu, Anda dapat menggunakan metode getUTC, yang bekerja sama dengan metode get, tetapi hitung waktu berdasarkan UTC (waktu universal). Di bawah ini adalah tabel metode UTC untuk objek Date dalam JavaScript.
| Tanggal Waktu | metode | Jangkauan | Contoh |
| Tahun | getUTCFullYear() | YYYY | 1970 |
| Bulan | dapatkanUTCMonth() | 0-11 | 0 = Januari |
| Hari dalam sebulan | dapatkanUTCDate() | 1-31 | 1 = tanggal 1 setiap bulan |
| Hari dalam seminggu | dapatkanUTCDday () | 0-6 | 0 = Minggu |
| Jam | dapatkanUTCHours () | 0-23 | 0 = tengah malam |
| Menit | getUTCMinutes () | 0-59 | |
| Kedua | getUTCSeconds () | 0-59 | |
| Mili detik | getUTCMillidetik () | 0-999 |
Untuk memeriksa perbedaan antara pengambil lokal dan pengambil UTC, jalankan kode berikut.
// Tetapkan waktu saat ini ke variabel
const sekarang = Tanggal baru ();
// Cetak zona waktu lokal dan UTC
console.log (sekarang.getHours ());
console.log (sekarang.getUTCHours ());
Kode ini akan mencetak waktu dan waktu saat ini dalam zona waktu UTC. Jika saat ini Anda berada di zona waktu UTC, maka angka yang akan dikeluarkan oleh program akan sama.
UTC menyediakan standar waktu internasional dan oleh karena itu dapat menjaga kode tetap konsisten dengan zona waktu jika diperlukan dalam program Anda.
Kesimpulan
Dalam tutorial ini, Anda belajar cara membuat instance objek Date dan cara menggunakan metode bawaannya untuk mengakses dan memodifikasi komponen tanggal tertentu. Anda dapat menemukan informasi lebih lanjut tentang waktu dan tanggal dalam JavaScript di Mozilla Developer Network.
Mengetahui cara bekerja dengan tanggal penting untuk banyak tugas umum dalam JavaScript, mulai dari membuat laporan rutin hingga menampilkan tanggal dan jadwal di zona waktu yang benar.
Tag:Gunakan Tanggal baru () untuk membuat objek Tanggal baru yang berisi tanggal dan waktu saat ini.
perhatikan itu Tanggal () callable tanpa argumen, setara dengan Tanggal baru (Tanggal.sekarang ()) .
Setelah Anda memiliki objek tanggal, Anda dapat menggunakan salah satu dari beberapa metode yang tersedia untuk mengambil propertinya (misalnya, getFullYear () untuk mendapatkan tahun 4 digit).
Berikut ini adalah beberapa metode tanggal yang umum.
Dapatkan tahun ini
var year = (Tanggal baru ()).getFullYear(); console.log (tahun); // Contoh keluaran: 2016Dapatkan bulan ini
var bulan = (Tanggal baru ()).getMonth(); console.log (bulan); // Keluaran sampel: 0Perhatikan bahwa 0 = Januari. Ini karena bulannya berkisar dari 0 sebelum 11 jadi seringkali diinginkan untuk menambahkan +1 ke indeks.
Dapatkan hari ini
var hari = (Tanggal baru ()).getDate(); console.log (hari); // Contoh keluaran: 31Dapatkan jam saat ini
var hours = (Tanggal baru ()).getHours(); console.log (jam); // Contoh keluaran: 10Dapatkan menit saat ini
var menit = (Tanggal baru ()).getMinutes(); console.log (menit); // Contoh keluaran: 39Dapatkan detik saat ini
var detik = (Tanggal baru ()).getSeconds(); console.log (kedua); // Keluaran sampel: 48Dapatkan milidetik saat ini
Untuk mendapatkan milidetik (0 hingga 999) dari instance objek Date, gunakan metode getMilliseconds.
Var milidetik = (Tanggal baru ()).GetMilliseconds(); console.log (milidetik); // Output: milidetik sekarang
Ubah waktu dan tanggal saat ini menjadi string yang dapat dibaca manusia
var sekarang = Tanggal baru (); // mengonversi tanggal menjadi string dalam format zona waktu UTC: console.log (now.toUTCString ()); // Keluaran: Rab, 21 Jun 2017 09:13:01 GMTMetode Date.now() statis mengembalikan jumlah milidetik sejak 1 Januari 1970 00:00:00 UTC. Untuk mendapatkan jumlah milidetik sejak saat itu menggunakan instance objek Date, gunakan metode getTime-nya.
// dapatkan milidetik menggunakan metode statis sekarang dari Date console.log (Date.now ()); // dapatkan milidetik menggunakan metode getTime of Date instance console.log ((New Date ()).getTime ());
Halo semuanya!
Saya sering harus bekerja dengan data statistik dan ada banyak yang terkait dengan tanggal. Selain itu, tanggal yang sama dapat digunakan pada halaman dalam format yang berbeda (misalnya, di tempat yang nyaman untuk mobil dan di tempat yang nyaman bagi seseorang). Saya pikir sebagian besar dari Anda sangat menyadari semua kode mengerikan yang datang dengan menggunakan objek Date.
Misalnya, untuk mendapatkan tanggal saat ini dalam format DD.MM.YYYY, kita perlu melakukan hal berikut:
var d = Tanggal baru (), fd = d.getDate () + "." + (d.getBulan() + 1) + "." + d.getFullYear();
Dan ketika ada banyak garis seperti itu? Apakah mudah diingat bahwa dalam javascript sebulan dimulai dari awal ketika Anda mengembangkan tidak hanya di dalamnya? Atau fakta bahwa ada milidetik, bukan detik, seperti hampir di semua tempat di backend? Anda dapat memecahkan beberapa masalah dengan perpustakaan Moment.js yang populer, tetapi bekerja sangat lambat.
Perpustakaan yang dimaksud memecahkan masalah ini.
Jika tertarik, saya sarankan Anda membaca ulasan kecil ini.
TempusJS adalah banyak gula sintaksis pada objek Date, jadi ini sangat cepat. Sintaks perpustakaan itu sendiri cukup sederhana. Misalnya, Anda dapat menulis contoh sebelumnya seperti ini:
var fd = tempus().format("% d.% m.% Y");
Sekarang tentang kecepatan. Di spoiler, Anda dapat melihat perbandingan Tempus dengan Momen dan format tanggal asli (lihat di atas):
Perbandingan JS asli, MomentJS dan TempusJS
Kami mendapatkan tanggal saat ini
JS asli x 2.175.575 ops / detik ± 0,75% (96 run sampel) Momen x 284.864 ops / detik ± 0,85% (96 run sampel) Tempus x 2.086.081 ops / detik ± 0,73% (97 run sampel)Memformat
JS asli x 1.637.517 ops / detik ± 0,61% (100 run sampel) Momen x 8,808 ops / detik ± 1,07% (100 run sampel) Tempus x 942.815 ops / detik ± 0,68% (94 run sampel)Deteksi otomatis tanggal dan penguraian
JS asli x 11.204.316 ops / detik ± 0,81% (88 run sampel) Momen x 38.511 ops / detik ± 1,41% (95 run sampel) Tempus x 93.973 ops / detik ± 1,06% (85 run sampel)Mengurai tanggal berdasarkan format
Momen x 46,293 ops / detik ± 0,63% (100 run sampel) Tempus x 109,947 ops / detik ± 0,93% (99 run sampel)Parsing dan validasi
Momen x 44.588 ops / dtk ± 1,09% (90 run sampel) Tempus x 103,439 ops / dtk ± 0,90% (94 run sampel)Hasilnya didapat di laptop saya di Google chrome 30.0.1599.114. Di browser lain, hasilnya berbeda, tetapi rasionya tetap sama.
Pustaka benchmark.js digunakan untuk pengujian.
Benchmark untuk fitur lainnya, bisa Anda lihat.
Jadi, kelebihan dari library ini dapat dituliskan sebagai berikut:
- Mendukung IE6 +, Chrome, Firefox, Opera;
- Mendukung rantai panggilan;
- Bulan dapat dimulai dengan 1 (default), bukan nol;
- Milidetik dapat dinonaktifkan (default) atau diaktifkan;
- Kerja cepat (Karena, dalam banyak kasus, objek Date asli browser digunakan, implementasinya ditulis dalam bahasa yang lebih cepat);
- Mendukung format dan plugin khusus
- Validasi tanggal sangat cepat dan hanya bergantung pada fungsi yang mengatur tanggal (karena validasi sudah terjadi saat nilai dimasukkan, dan tidak dihitung secara terpisah);
- Multibahasa dan deteksi otomatis bahasa pengguna.
Di sini kita hanya akan berbicara tentang beberapa fungsi.
Memformat dan menguraikan
Jadi, sebagai permulaan, satu lagi contoh pemformatan tanggal. Kami juga menggunakan rantai panggilan di sini. Di akhir setiap pengaturan, kita mendapatkan kembali objek TempusDate yang dapat kita gunakan lebih jauh ke bawah rantai. Contoh:
tempo (). // dapatkan perhitungan tanggal baru ((bulan: -1)). // kurangi dengan format satu bulan ("% d.% m.% Y"); // Keluaran sebagai string
Dengan demikian, kita akan mendapatkan hari, jam, dan detik yang sama, tetapi sebulan yang lalu. Ini berguna untuk mendapatkan laporan selama sebulan terakhir.
Contoh selanjutnya adalah mengurai tanggal.
// Mengembalikan objek TempusDate dengan tanggal "2013-11-18" tempus ("18/11/2013"); // Mengembalikan objek TempusDate dengan tanggal "2013-12-12" tempus ("2013-12-12", "% Y-% m-% d"));
Tempus dapat secara otomatis mendeteksi beberapa format yang dikenal. Juga, Anda dapat menentukan format tertentu, maka parsing akan lebih cepat. Plus, Anda dapat mengatur tanggal yang akan dikembalikan jika penguraian gagal:
// Karena "123" tidak cocok dengan format "% d.% M.% Y", lalu // objek yang berisi tempus tanggal 01-01-2013 ("123", "% d.% M.% Y", tempus ());
Daftar format default dapat dilihat
Sekarang mari kita ubah format tanggal yang sudah diformat
// "2013-11-05" tempus ("05.11.2013").Format ("% Y-% m-% d"); // Atau begitulah // "Oktober, 12" tempus ("2013-10-12 12:31:01", "% Y-% m-% d% H:% M:% S").Format ("% B,% d ");
Anda juga dapat menggunakan pelokalan untuk pemformatan. Secara default, bahasa pengguna akan dipilih (diambil dari browser) atau bahasa default jika bahasa pengguna tidak ditemukan di antara bahasa Tempus yang tersedia.
// Atur bahasa tempus.lang ("ru"); // Secara default kita menggunakan format // "November 05" tempus (1383609600) .format ("% B,% d");
Pada saat ini Hanya ada dua bahasa - Rusia dan Inggris, jadi saya akan dengan senang hati membantu.
Validasi
Validasi tanggal adalah sebagai berikut:// Mengembalikan false tempus ("08/32/2013", "% d.% M.% Y"). Valid (); // Mengembalikan true tempus ("00:00 01.01.2012", "% H:% M% d.% M.% Y"). Valid ();
Jika terjadi kesalahan, Anda dapat melihat bidang tempat kesalahan itu terjadi - di mana pun nilainya tidak salah:
// Mengembalikan ("tahun": - 5, "bulan": false, "hari": false, "jam": false, // "menit": false, "detik": false, "milidetik": false) tempus (). tahun (-5). // atur tahun = -5, mis. kesalahan tidak valid(); // dapatkan objek dengan kesalahan
Rentang tanggal
Terkadang kita perlu mendapatkan jumlah tahun (misalnya, usia), bulan, hari, dll. antara dua tanggal. Untuk melakukan ini, kita dapat menggunakan metode antara, yang menemukan perbedaan antara dua tanggal dan pengembalian dalam format yang diinginkan ("tahun", "bulan", "hari", "jam", "menit", "detik", " milidetik").Berikut adalah contoh sederhana untuk mendapatkan jumlah bulan antara 1 November 2013 dan 5 Mei 2014:
// Mengembalikan 6 tempus ().Antara (tempus(), "bulan");
Atau berapa jam lagi sampai tahun baru
tempus().antara (tempus()), "jam");
Pada contoh terakhir, Anda dapat melihat bahwa saya hanya menentukan tahun. Saat mengatur nilai ke array atau objek, nilai yang hilang adalah
diisi dengan minimum. Daftar konstanta dengan nilai minimum, Anda dapat melihat di dokumentasi.
Juga, kami dapat mengubah tanggal apa pun menggunakan fungsi kalk:
// Mengembalikan TempusDate dengan tanggal 2012-01-01 tempus ().Calc ((tahun: 1, bulan: -4, hari: -1));
Format khusus
Kami menerapkan format kami sendiri untuk bulan tersebut, yang dapat mengambil nilai dari 1 hingga 12 (bukan 01 hingga 12):// Daftarkan format baru tempus.registerFormat ("% q", // directive -% q function (date) (// Disini kita tentukan fungsi formatnya, yaitu apa yang akan menggantikan %q return date.month(); ) , function (value) (// Dan berikut adalah fungsi parsing var v = Number (value); return (month: (isNaN (v)? undefined: v));), 1, // Panjang minimum yang nilai 2 dapat diambil , // Panjang maksimum "angka" // Jenis); // Pengujian // Mengembalikan "01.13.2013"; tempus ((tahun: 2013, bulan: 1, hari: 1)).format ("% d.% q.% Y"); // Mengembalikan ("tahun": 2013, "bulan": 2, "hari": 10, "jam": 0, "menit": 0, "detik": 0); tempus ("10.2.2013", "% d.% q.% Y").get ();
Selama pendaftaran, Anda dapat melihat bahwa beberapa parameter diatur secara terpisah, sementara Anda dapat menggunakan ekspresi reguler... Sebenarnya, awalnya itu ada di sana, tetapi setelah meninggalkannya, kecepatannya meningkat beberapa kali lipat.
Jika Anda perlu menghapus format, gunakan unregisterFormat:
tempus.unregisterFormat("% d"); // Mengembalikan "% d.01.2013", karena direktif% d tidak ada lagi. tempus.format ((tahun: 2013, bulan: 1, hari: 1), "% d.% m.% Y");
Getter / Setter
Anda bisa mendapatkan / mengatur beberapa nilai menggunakan fungsi tahun (), bulan (), hari (), jam (), menit (), detik (), milidetik (), dayOfWeek (), utc (), timestamp () atau set (). Sebagai contoh:tempo (). // Dapatkan tanggal saat ini tahun (1900). // Biarkan apa adanya, tapi set ke 1900 leapYear(); // Periksa apakah ini tahun kabisat, dalam hal ini false tempus().Tahun(); // Jadi kita mendapatkan tahun sekarang dalam bentuk numerik
Menghasilkan tanggal
Anda dapat membuat tanggal dengan berbagai cara, daftar lengkap parameter ada di dokumentasi. Berikut adalah contoh minimal.// mengembalikan ["29/03/2013", "30/03/2013", "31/03/2013", "04/01/2013", "04/02/2013"]; tempus.generate ((dateFrom: "20130329", formatFrom: "% Y.% m.% d", dateTo: "20130402", periode: (hari: 1), format: "% d.% m.% Y" ));
Ini dapat berguna untuk menampilkan grafik menurut tanggal dan mengubah format tampilan langsung pada klien, tanpa meminta backend. Tanggal dapat dihasilkan baik sebagai array atau sebagai objek, di mana tanggal itu sendiri akan menjadi kuncinya (ini berguna ketika kita perlu mengikat suatu acara ke suatu tanggal, misalnya, ketika kita membuat kalender kita sendiri). Juga, tanggal dapat dikelompokkan berdasarkan hari, minggu, bulan, jam, tahun - apa pun. Ini juga dapat diterapkan pada kalender.
Plugin
Dan yang terakhir, plugin. Di sini kami memperluas pabrik untuk menghasilkan tanggal acak. Kami juga membutuhkan kelas TempusDate, yang dapat ditemukan di tempus.classes (). Berikut ini contoh plugin:(function (tempus) (var TempusDate = tempus.classes ("TempusDate"); tempus.randomDate = function () (var date = new TempusDate (); date.year (Math.floor ((Math.random () * ( tempus.MAX_YEAR - tempus.MIN_YEAR)) + tempus.MIN_YEAR)) bulan (Math.floor ((Math.random () * (tempus.MAX_MONTH - tempus.MIN_MONTH)) + tempus.MIN_MONTH)) hari (Matematika. random () floor ((Math.random () * (date.dayCount () - tempus.MIN_DAY)) + tempus.MIN_DAY)). jam (Math.floor ((Math.random () * (tempus.MAX_HOURS - tempus .MIN_HOURS) ) + tempus.MIN_HOURS)). menit (Math.floor ((Math.random () * (tempus.MAX_MINUTES - tempus.MIN_MINUTES)) + tempus.MIN_MINUTES)). detik (Math.floor ((Math. acak () * (tempus.MAX_SECONDS - tempus.MIN_SECONDS)) + tempus.MIN_SECONDS)); tanggal kembali;);)) (tempus); // Sekarang kita dapat membuat tanggal sebagai berikut var someRandomDate = tempus.randomDate();
Saya pikir dengan cara ini akan mungkin untuk menulis widget dengan mudah menggunakan banyak jQuery + Tempus, Angular + Tempus, dll.
Kode sumber
Anda dapat menginstal dengan mengunduh sumber dari github:https://github.com/crusat/tempus-js/releases
Atau melalui bower:
$ bower instal tempus
Anda hanya membutuhkan satu file - tempus.js atau tempus.min.js.
Saya berharap perpustakaan ini bermanfaat, dan juga menarik untuk mengetahui apa yang hilang di dalamnya untuk lebih mengembangkan perpustakaan ke arah yang benar. Terimakasih atas perhatiannya!
P.S. Terima kasih untuk undangan nya!
Hal lain yang berguna untuk situs web adalah memasukkan tanggal saat ini. Ada lusinan contoh skrip tanggal di Internet, tetapi banyak di antaranya, menurut saya, berat dan, karenanya, jelek. Sementara itu, menggunakan sarana standar JavaScript, sangat mudah untuk menyisipkan tanggal di halaman situs web. Saya sangat sering menggunakannya! Dalam gambar (tangkapan layar dari situs saat ini) perkebunan "Dongeng" !
Berikut ini seluruh skrip tanggal:
Menurut pendapat saya, itu tidak bisa lebih mudah, itu cukup indah dan dapat dimengerti. Jika Anda tidak memiliki keinginan untuk mempelajari konstruksi skrip ini, cukup tempelkan di mana saja di halaman HTML dan Anda akan mendapatkan tulisan berikut:
Pilihan lain lebih maju
! Hari ini
Ini terlihat seperti ini:
Hari ini
Secara umum, tidak diperlukan keterampilan, cukup masukkan kode dengan bodoh dan semuanya baik-baik saja!
Keterangan lebih lanjut:
Jadi, kita mulai dengan menetapkan nilai tanggal ke variabel D, lalu buat array ( Himpunan) untuk hari-hari dalam seminggu ( hari) dan bulan ( bulan), menunjukkan mereka dalam bentuk tata bahasa yang diperlukan: kasus, nomor, huruf kapital jika kata tersebut di awal tanggal, dll. Baris terakhir skrip adalah pencetakan tanggal aktual ( dokumen. tulis). Di sini Anda mengatur apa dan dalam urutan apa Anda akan menampilkan tanggal saat ini dalam string. Komponen-komponen tersebut dipisahkan satu sama lain oleh tanda + ... Untuk memasuki ruang, gunakan konstruksi " " , dan untuk memasukkan huruf g (tahun) - konstruksi " G."
Seperti yang Anda lihat dari skrip, mendapatkan data tentang waktu saat ini dilakukan oleh elemen Dapatkan... Metode ini memberikan informasi berikut:
- getDate()- mengembalikan angka dari 1 hingga 31 yang mewakili hari dalam sebulan;
- dapatkan hari ()- mengembalikan hari dalam seminggu sebagai bilangan bulat dari 0 (Minggu) hingga 6 (Sabtu);
- dapatkanBulan()- mengembalikan nomor bulan dalam setahun;
- dapatkanSetahun Penuh()- mengembalikan tahun. Untuk menggunakan secara sederhana dapatkanTahun(), maka tahun berjalan minus 1900 akan ditampilkan;
- dapatkan Jam ()- mengembalikan jam dalam sehari;
- getMinutes ()- mengembalikan menit sebagai angka dari 0 hingga 59;
- getSeconds ()- mengembalikan jumlah detik dari 0 hingga 59.
Tempel langsung Jawa-script di dalam halaman situs tidak selalu nyaman. Lebih baik menempatkan deskripsi skrip di bagian atas halaman di antara tag
dan atur variabel yang akan kita panggil sesuai kebutuhan dalam teks. Sebut saja HARI INI dan tentukan bentuk tampilan tanggal di dalamnya mirip dengan di atas. Scriptnya akan terlihat seperti ini:
Untuk menampilkan tanggal, panggil skrip di tempat yang tepat dalam kode HTML halaman menggunakan perintah berikut:
Jika situs Anda berisi banyak halaman tempat Anda ingin menampilkan tanggal, maka akan lebih mudah untuk menyorotnya Jawa-script untuk menampilkan tanggal di file terpisah, Misalnya, data.js... Dalam praktiknya, ini adalah halaman yang terdiri dari skrip pertama yang dijelaskan, yaitu dengan baris dokumen. tulis(Lihat di atas). Itu harus ditempatkan di direktori yang sama dengan halaman utama, dan dipanggil di tempat keluaran tanggal sebagai berikut:
Jangan lupa cek filenya data.js memiliki penyandian yang sama dengan dokumen utama, jika tidak, tanggal akan ditampilkan dengan kait, kotak, dan penyesuaian lainnya yang luar biasa.
Komentar. Harus diingat bahwa skrip yang dijelaskan menampilkan tanggal yang ditetapkan di komputer pengguna, yang tidak selalu sesuai dengan waktu aktual saat ini. Jika Anda perlu menunjukkan waktu yang tepat, maka Anda perlu menggunakan skrip PHP yang akan menunjukkan waktu di server.
