Jak poprawnie korzystać z daty wg ustawień regionalnych w JavaScript?

By /

JavaScript

Praca z datami jest kluczowym elementem wielu aplikacji webowych. JavaScript oferuje obiekty Date, które pozwalają na manipulację datami i czasem. Jednak prezentacja daty zgodnie z ustawieniami regionalnymi użytkownika może być nieco bardziej skomplikowana. Używając obiektu Intl.DateTimeFormat, możemy formatować daty w sposób, który jest zrozumiały i przyjazny dla użytkowników z różnych części świata.

Przykład użycia Intl.DateTimeFormat w JavaScript

W poniższym przykładzie pokażemy, jak wyświetlić aktualną datę zgodnie z różnymi ustawieniami regionalnymi. Użyjemy do tego obiektu Intl.DateTimeFormat.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Formatowanie daty wg ustawień regionalnych</title>
</head>
<body>
    <div id="date"></div>

    <script>
        // Pobranie aktualnej daty
        let currentDate = new Date();

        // Formatowanie daty dla Polski
        let plFormat = new Intl.DateTimeFormat('pl-PL')
                                 .format(currentDate);

        // Formatowanie daty dla Stanów Zjednoczonych
        let usFormat = new Intl.DateTimeFormat('en-US')
                                      .format(currentDate);

        // Wyświetlenie sformatowanych dat
        document.getElementById('date').innerHTML = `
            <p>Data dla Polski: ${plFormat}</p>
            <p>Data dla USA: ${usFormat}</p>
        `;
    </script>
</body>
</html>

Komentarze do kodu

  • Używamy obiektu Date do pobrania aktualnej daty.
  • Następnie, tworzymy instancje Intl.DateTimeFormat dla Polski (pl-PL) i dla Stanów Zjednoczonych (en-US), aby sformatować datę zgodnie z ustawieniami regionalnymi tych krajów.
  • Sformatowane daty są wyświetlane w elemencie div o id date za pomocą innerHTML.

Podsumowanie

W tej lekcji nauczyliśmy się, jak używać Intl.DateTimeFormat do formatowania dat zgodnie z ustawieniami regionalnymi. Jest to szczególnie przydatne w aplikacjach, które są używane przez użytkowników z różnych części świata, ponieważ pozwala na prezentację daty w formacie, który jest dla nich najbardziej naturalny i zrozumiały. Dzięki Intl.DateTimeFormat, możemy łatwo dostosować format daty do preferencji użytkownika, co jest kluczem do budowania globalnych i lokalnych aplikacji webowych.

Jeżeli chcesz przyśpieszyć swoją naukę tworzenia stron chciałbym polecić mój kurs video JavaScript w którym nauczysz się tego języka od podstaw do zaawansowanych jego aspektów.

Powiązane artykuły

Scroll to Top