Wprowadzenie do formatów daty JavaScript

Data jest wbudowanym obiektem w JavaScript i przechowuje datę i godzinę oraz służy do przechowywania, tworzenia i modyfikowania czasu, pomiaru czasu lub wyświetlania bieżącej daty z lub bez komponentu „time” w różnych formatach według potrzeb. Zapewnia także różne funkcje i metody zabawy.

JavaScript Data wystąpienie reprezentuje moment w czasie niezależnym od platformy. Obiekt Data przenosi zarówno część daty, jak i część godziny. ISO 8601 (RRRR-MM-DD) to międzynarodowy standard prezentacji daty i godziny oraz preferowanego formatu daty w JavaScript. Ponadto obiekty Date zawierają liczbę reprezentującą datę i godzinę w milisekundach od 1 stycznia 1970 roku UTC, w zależności od wartości nadanej obiektowi Date.

Składnia

Aby zdefiniować nowy obiekt Date, musimy wywołać nową Date () z jedną z następujących opcji:

new Date();
new Date(value);
new Date(dateString);
new Date(year, month index (, day (, hours (, minutes (, seconds (, milliseconds))))));

Musimy użyć nowego operatora do utworzenia obiektu Date. Jeśli użyjemy bezpośrednio obiektu Date, takiego jak now = Date (), zwróconą wartością jest ciąg znaków, a nie obiekt Date.

Jeśli nie podano argumentów, obiekt Date wyświetla bieżącą datę i godzinę. Domyślnie obiekt Date w JavaScript wyświetla datę / czas w czasie lokalnym.

Przykłady formatów daty JavaScript

Zobaczmy za pomocą poniższych przykładów:

Przykład 1

Wyświetl aktualną datę i godzinę

Kod



JS Dates

var current_date = new Date();
document.getElementById("display").innerHTML = current_date;



JS Dates

var current_date = new Date();
document.getElementById("display").innerHTML = current_date;



JS Dates

var current_date = new Date();
document.getElementById("display").innerHTML = current_date;

Wynik:

Formaty daty

Różne sposoby formatowania daty w JavaScript to:

  • Data ISO (norma międzynarodowa) - „2019-11-06”
  • Długa data - „12 listopada 2019 r.” Lub „12 listopada 2019 r.”
  • Krótka data - „12.11.2019”

Przykład nr 2

Wyświetlaj daty w różnych formatach

Kod



JS Dates

const months = ("JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC");
var current_date = new Date();
console.log("ISO Format: ", current_date.getFullYear()+"-"+current_date.getMonth()+"-"+current_date.getDate())
console.log("Long Format: ", current_date.getDate()+" "+months(current_date.getMonth())+" "+current_date.getFullYear())
console.log("Short Format: ", current_date.getDate()+"-"+current_date.getMonth()+"-"+current_date.getFullYear())



JS Dates

const months = ("JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC");
var current_date = new Date();
console.log("ISO Format: ", current_date.getFullYear()+"-"+current_date.getMonth()+"-"+current_date.getDate())
console.log("Long Format: ", current_date.getDate()+" "+months(current_date.getMonth())+" "+current_date.getFullYear())
console.log("Short Format: ", current_date.getDate()+"-"+current_date.getMonth()+"-"+current_date.getFullYear())



JS Dates

const months = ("JAN", "FEB", "MAR", "APR", "MAY", "JUN", "JUL", "AUG", "SEP", "OCT", "NOV", "DEC");
var current_date = new Date();
console.log("ISO Format: ", current_date.getFullYear()+"-"+current_date.getMonth()+"-"+current_date.getDate())
console.log("Long Format: ", current_date.getDate()+" "+months(current_date.getMonth())+" "+current_date.getFullYear())
console.log("Short Format: ", current_date.getDate()+"-"+current_date.getMonth()+"-"+current_date.getFullYear())

Wynik:

Z powyższego kodu możemy zobaczyć, że część miesiąca rozpoczyna się od zera, tj. Styczeń jest miesiącem zerowym. To samo dotyczy pory dziennej (getDay ()), niedziela zaczyna się od zera.

Kiedy określamy datę w formacie ciągu w obiekcie Date, zwykle piszemy jako „12-11-2019” (12 listopada 2019 r.), Ale w JavaScript określenie daty w tym formacie powoduje, że otrzymujemy niewłaściwą wartość daty.

Przykład nr 3

Wyświetlana jest niewłaściwa data

Kod



JS Dates

var current_date = new Date('12-11-2019');
document.getElementById("display").innerHTML = current_date;



JS Dates

var current_date = new Date('12-11-2019');
document.getElementById("display").innerHTML = current_date;



JS Dates

var current_date = new Date('12-11-2019');
document.getElementById("display").innerHTML = current_date;

Wynik:

Teraz wyświetlamy datę i godzinę w milisekundach za pomocą funkcji Date.parse (). Ta funkcja pobiera dokładną liczbę milisekund, które upłynęły od północy, 1 stycznia 1970 r., Do podanej daty.

Przykład 4

Data w milisekundach

Kod



var msec_date = Date.parse('12-11-2019');
console.log("Date in Milli-Seconds:", msec_date)

Wynik:

Zaletą obiektu JavaScript Date jest to, że jeśli podamy wartość, która nie mieści się w dopuszczalnym zakresie, JavaScript automatycznie ponownie oblicza datę, aby uzyskać akceptowalną wartość daty. Rozważmy przykład:

Przykład 5

Automatyczna korekta wartości daty

Kod



var autocorrect_date = new Date(2019, 9, 46);
console.log("Date Value:", autocorrect_date)

Wynik:

Powyższy przykład kodu ponownie oblicza podaną wartość i wyświetla poprawną, akceptowalną wartość daty. Ponadto, jeśli zauważymy sekcję kodu dotyczącą sposobu dostarczania wartości danych, wydaje się, że możemy rozbić część wartości daty i godziny i przedstawić ją jako pojedyncze liczby oddzielone przecinkiem. Wartość „9” oznacza miesiąc październikowy, jak omówiono we wcześniejszej części tego artykułu, że część miesiąca miesiąca rozpoczyna się od 0 (styczeń = 0, luty = 1 itd.)

Wniosek

W tym artykule poznaliśmy obiekt daty JavaScript i zrozumieliśmy różne formaty daty i godziny, które mogą być wyświetlane w JavaScript przy użyciu wbudowanych metod daty i godziny. Jedną z najlepszych praktyk jest tworzenie dat za pomocą metody argumenty i unikanie stosowania metody ciągu daty.

Polecane artykuły

To jest przewodnik po formatach daty JavaScript. Tutaj omawiamy Wprowadzenie do JavaScript wraz z odpowiednimi przykładami. Możesz także przejrzeć nasze inne sugerowane artykuły, aby dowiedzieć się więcej -

  1. Bezpieczeństwo aplikacji internetowych
  2. Co to jest WebSocket?
  3. Co to są usługi sieciowe ASP.Net?
  4. Co to jest Selenium Web Driver?