Moment.js: Popolna razlaga in praktični primeri knjižnice datumov

Informatec Digital » Idiomi » Moment.js: Popolna razlaga in praktični primeri knjižnice datumov

Delo z datumi in časi v JavaScriptu je lahko prava odisejada za razvijalce spletnih aplikacij.Na srečo obstajajo orodja, kot je Moment.js, ki močno poenostavijo ta postopek in olajšajo vse od osnovnega oblikovanja datumov do kompleksnih manipulacij in operacij validacije. Če ste se kdaj znašli v situaciji, ko ste poskušali pravilno pretvoriti, primerjati ali prikazati datume v svojih projektih, je bil Moment.js verjetno med vašimi najboljšimi zavezniki ali pa bi ga vsaj morali upoštevati.

V tem članku vam bom povedal vse, kar morate vedeti o Moment.js.: od njegovih osnovnih funkcij in manj znanih trikov do praktičnih primerov in integracije z drugimi knjižnicami, vključno z jasno razlago sintakse in nalog, ki jih lahko reši. Ogledali si bomo tudi njegove omejitve, nedavne posodobitve in alternative, ki jih imate, če iščete nekaj sodobnejšega.

Kaj je Moment.js in zakaj je postal tako priljubljen?

Moment.js je knjižnica JavaScript, zasnovana tako, da delo z datumi in časi postane neboleče opravilo.Omogoča vam ustvarjanje, analiziranje, manipuliranje in prikazovanje datumov v poljubni možni obliki s preprosto in zmogljivo sintakso. Ta knjižnica že leta ... Vodilna rešitev skupnosti za premagovanje omejitev izvornega objekta Date() v JavaScriptu.

Jedro Moment.js se vrti okoli objekta trenutek(), ki je sposoben konstruirati datume iz skoraj vseh veljavnih vhodnih podatkov: besedilnih nizov, objektov Date, časovnih žigov ali celo numeričnih argumentov. Zaradi tega je izjemno prilagodljiv in uporaben v vseh vrstah projektov, od majhnih skript do poslovnih aplikacij, ki upravljajo mednarodne časovne pasove ali zgodovinske zapise.

Kaj ga je pripeljalo do uspeha? Njegova zanesljivost, enostavnost uporabe in raznolikost orodij in vtičnikov, ki so priloženi.Tudi ko je projekt prešel v vzdrževalni način, Moment.js vzdržuje veliko uporabniško bazo in obsežno dokumentacijo., s čimer je utrdil svoj položaj kot vodilna rešitev za datume v JavaScriptu in Node.js.

Ključne značilnosti in prednosti Moment.js

• Preprost in intuitiven APIEna največjih prednosti Moment.js je njegova jasna sintaksa. Z njim lahko v samo nekaj vrsticah izvedete preproste operacije, kot je pridobivanje trenutnega datuma ali pretvorba niza v določeno obliko, ali pa kompleksne izračune in validacije.
• Prilagodljivo razčlenjevanje in oblikovanjeRazčlenjevanje datumskih nizov skoraj katere koli oblike in njihovo pretvarjanje v želeni izhod še nikoli ni bilo lažje. Moment.js omogoča hitro in enostavno oblikovanje datumov v predstavitvah po meri..
• Manipulacija datumovSeštevanje ali odštevanje dni, mesecev, let, tednov ali katere koli druge časovne enote je tako preprosto kot uporaba metod dodaj () y odštej()To je zelo uporabno, kadar morate delati z relativnimi datumi, roki ali časovnimi okviri, ki se dinamično spreminjajo.
• Robustna validacijaČe morate preveriti, ali je datum veljaven oziroma obstaja (na primer 30. februar), vam Moment.js to olajša. Metoda isValid() Sposoben je zaznati subtilne napake v obliki ali logiki datumov.
• Podpora za časovne pasove in lokalizacijoZahvaljujoč vašemu vtičniku trenutek-časovni pasPretvarjanje datumov med različnimi časovnimi pasovi je zelo enostavno. Prikažete lahko tudi datume, prilagojene uporabnikovemu jeziku in regionalnim konvencijam, kar je ključnega pomena pri globalnih aplikacijah.
• Ekosistem vtičnikovPoleg glavne knjižnice obstaja ekosistem vtičnikov za razširitev njene funkcionalnosti (koledar, združljivost z drugimi ogrodji, eksotični formati ...).

Kako začeti uporabljati Moment.js v svojem projektu

Namestitev je zelo preprostaDatoteko Moment.js lahko vključite v HTML z eno samo vrstico:

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

Če delate z Node.js ali sodobnim razvojnim okoljem, ga je običajno namestiti z npm ali yarn:

npm install moment

Ko je to storjeno, lahko uvozite Moment.js v skladu s sintakso, ki jo uporabljate:

// Versión CommonJS
var moment = require('moment');
moment().format();

// ES6
import moment from 'moment';
moment().format();

Ustvarjanje datumov: različni načini in praktični primeri

Preprosto ustvarite datume

Če želite dobiti trenutni datum in čas, preprosto uporabite moment():

console.log(moment()); // Devuelve la fecha actual en formato ISO8601

Določen datum lahko sestavite s podajanjem argumentov:

moment("2022-10-14"); // Crea el 14 de octubre de 2022

Začnete lahko tudi z danim nizom in obliko zapisa, tudi v strogem načinu:

moment("25/12/1995", "DD/MM/YYYY", true); // Analiza y comprueba el formato

Ali imate izvorni objekt Date?

const fechaJS = new Date();
const miFecha = moment(fechaJS);

Oblikovanje in prikaz datumov

Moment.js omogoča prikaz datumov v poljubni možni oblikiNa primer, za prikaz trenutnega datuma kot dan/mesec/leto:

moment().format('DD/MM/YYYY');

Če želite bolj humanizirano verigo, lahko uporabite:

moment().format('MMMM Do YYYY, h:mm:ss a'); // Ejemplo: "marzo 8º 2024, 3:21:10 pm"

Nekaj uporabnih žetonov za oblikovanje:

• YYYY: 4-mestno leto
• MMmesec
• DD: dan v mesecu
• hh o HH: čas (12-urni ali 24-urni format)
• mmminut
• sssekunde
• a: dopoldne/popoldne

Na primer, če želite prikazati samo čas:

moment().format('HH:mm:ss');

Napredno oblikovanje z žetoni in regionalno podporo

Moment.js podpira več lokaliziranih formatov in prevodovJezike je mogoče sproti preklapljati, da se imena mesecev in dni prikažejo v drugem jeziku:

moment.locale('es'); // Cambia a español
document.write(moment().format('LLLL'));
// Ejemplo: martes, 8 de marzo de 2024 15:21

Manipulacija datumov: seštevanje, odštevanje in primerjava

Delo z relativnimi datumi je ena od prednosti Moment.js.

• Dodajte dneve, mesece ali leta:

  moment().add(3, 'days').format('DD/MM/YYYY');

• Odštevanje enot:

  moment().subtract(2, 'months').format('DD/MM/YYYY');

• Začetek in konec menstruacije:

  moment().startOf('month').format('DD/MM/YYYY'); // Primer día del mes
  moment().endOf('month').format('DD/MM/YYYY');   // Último día del mes

Preverjanje datumov in odkrivanje napak

Preden začnete z datumi, je ključnega pomena preveriti njihovo pravilnost:

moment('2024-02-30', 'YYYY-MM-DD').isValid(); // false, el 30 de febrero no existe

To Izogibajte se nepričakovanim napakam v aplikacijah, ki prejemajo podatke od uporabnika.

Primerjava datumov: preverite, ali je datum med drugimi

Moment.js vključuje več metod za primerjavo datumov:

• jePred()Preveri, ali je en datum pred drugim.
• jePo(): Preveri, ali je datum poznejši.
• jeMed(): Označuje, ali je datum med dvema podanima datumoma.

let hoy = moment();
let ayer = moment().subtract(1, 'days');
console.log(hoy.isAfter(ayer)); // true

Obravnavanje časovnih pasov in mednarodnih datumov

Ko delate z uporabniki v različnih delih sveta, lahko časovni pasovi postanejo past.Z vtičnikom trenutek-časovni pas Datume lahko preprosto pretvorite med regijami:

const moment = require('moment-timezone');
const fechaUTC = moment('2024-05-25');
const fechaNY = fechaUTC.tz('America/New_York').format('YYYY-MM-DD HH:mm:ss');
console.log(fechaNY);
// Ejemplo: "2024-05-24 20:00:00"

Poleg tega lahko Moment.js predstavi datume, prilagojene uporabnikovim lokalnim nastavitvam., ki prikazuje pravilno prevedena imena mesecev in dni.

Ključni primeri uporabe in napredni nasveti

Pridobi razlike med datumi

Čas, ki je pretekel med dvema datumoma, lahko izračunate v različnih enotah:

let inicio = moment('2024-01-01');
let fin = moment('2024-03-08');
let dias = fin.diff(inicio, 'days'); // Devuelve el número de días entre ambas

Relativni datumi in človeški časi

Moment.js je odličen za prikaz sporočil, kot so "pred 3 dnevi" ali "čez 5 ur":

moment().subtract(3, 'days').fromNow(); // "hace 3 días"
moment().add(2, 'hours').fromNow();    // "en 2 horas"

Človeški koledar

Funkcija koledar() Prikazuje relativne datume, kot sta »včeraj ob 17:00« ali »jutri ob 9:00«, zaradi česar je zelo uporaben za aplikacije koledarja.

moment().subtract(1, 'days').calendar(); // "Ayer a las..."
moment().add(3, 'days').calendar();     // "Próximo martes a las..."

Podpora za letne skoke in posebne dni

Ali želite vedeti, ali je leto prestopno leto?

moment([2024]).isLeapYear(); // true

Metoda jeLeapYear() ti da odgovor neposredno.

Napredna prilagoditev: formati, žetoni in strogo razčlenjevanje

Moment.js omogoča delo z nizi in žetoni po meri za ustvarjanje ali branje datumov v številnih oblikahPoleg tega strog način zahteva natančna ujemanja, s čimer se izognemo subtilnim napakam in neželenim presenečenjem.

Na primer, za razčlenitev datuma v obliki "dan/mesec/leto":

moment('12/03/2023', 'DD/MM/YYYY', true);

Seznam pogostih žetonov in primerov

• Leto: LLLL (2024), LL (24), LL (-500)
• Mes: MM (01 – 12), MMM (jan), MMMM (januar)
• Día: DD (01 – 31), C (1. – 31.)
• Ura: HH (00–23), hh (01–12), mm (minute), ss (sekunde)
• Časovni pasZ, ZZ

Te žetone je mogoče kombinirati za ustvarjanje popolnoma prilagojenih izhodov. Za celoten seznam in posebne primere glejte dokumentacijo.