Ένας οριστικός τρόπος για τη μορφοποίηση ημερομηνιών για διεθνείς τοποθεσίες
Οι μορφές ημερομηνιών ποικίλλουν ανάλογα με την περιοχή και τη γλώσσα, οπότε είναι πάντα χρήσιμο αν μπορούμε να βρούμε έναν τρόπο εμφάνισης των ημερομηνιών στους χρήστες, ειδικά για τη γλώσσα και την περιοχή τους.
Τον Δεκέμβριο του 2012, η ECMA δημοσίευσε τις προδιαγραφές του API διεθνοποίησης για JavaScript. Το API διεθνοποίησης μας βοηθάει να εμφανίζουμε ορισμένα δεδομένα σύμφωνα με τη γλώσσα και τις ακραίες προδιαγραφές. Μπορεί να χρησιμοποιηθεί για να εντοπίστε νομίσματα, ζώνες ώρας κι αλλα.
Σε αυτή τη θέση θα εξετάσουμε μορφοποίηση ημερομηνίας χρησιμοποιώντας αυτό το API.
Γνωρίστε την τοπική ρύθμιση του χρήστη
Για να δείξετε την ημερομηνία σύμφωνα με την προτιμώμενη τοπική ρύθμιση του χρήστη, πρώτα πρέπει να ξέρουμε τι είναι αυτή η προτιμώμενη τοπική ρύθμιση. Επί του παρόντος, ο αλάνθαστος τρόπος να γνωρίζετε ότι είναι να ζητήσετε από το χρήστη? αφήστε τους χρήστες να επιλέξουν τις προτιμώμενες ρυθμίσεις γλώσσας και περιοχής στην ιστοσελίδα.
Αλλά, αν αυτό δεν είναι επιλογή, μπορείτε να ερμηνεύσετε το Αποδοχή γλώσσας
ζητήστε την κεφαλίδα ή διαβάστε το πλοήγηση
(για Chrome και Firefox) ή πλοήγησης.browserΓλώσσα
(για τις τιμές IE).
Να γνωρίζετε ότι δεν είναι όλες αυτές οι επιλογές να επιστρέψουν την προτιμώμενη γλώσσα του UI του προγράμματος περιήγησης.
var language_tag = window.navigator.browserΓλώσσα || window.navigator.language || "en"; // επιστρέφει ετικέτες γλώσσας όπως 'en-GB'
Ελέγξτε το API διεθνοποίησης
Για να μάθουμε αν το πρόγραμμα περιήγησης υποστηρίζει API διεθνοποίησης ή όχι, μπορούμε να ελέγξουμε για την παρουσία του παγκόσμιου αντικειμένου Intl
.
αν (window.hasOwnPropertyâ €‹("Intl") && typeof Intl === "αντικείμενο") // Το API διεθνοποίησης είναι παρόν, ας το χρησιμοποιήσουμε
ο Intl αντικείμενο
Intl
είναι ένα παγκόσμιο αντικείμενο για τη χρήση του API Διεθνοποίησης. Έχει τρεις ιδιότητες που είναι κατασκευαστές για τρία αντικείμενα δηλαδή Συλλέκτης
, ΑριθμόςFormat
, και DateTimeFormat
.
Ο στόχος που θα χρησιμοποιήσουμε είναι DateTimeFormat
που θα μας βοηθήσουν να διαμορφώσουμε το χρόνο ημερομηνίας ανά διαφορετικές γλώσσες.
ο DateTimeFormat αντικείμενο
ο DateTimeFormat
Ο κατασκευαστής λαμβάνει δύο προαιρετικά επιχειρήματα.
locales
- μια συμβολοσειρά ή μια σειρά από συμβολοσειρές που αντιπροσωπεύουν τις ετικέτες γλώσσας, για παράδειγμα. “de” για τη γερμανική γλώσσα, “en-GB” για τα αγγλικά που χρησιμοποιούνται στο Ηνωμένο Βασίλειο. Εάν δεν αναφέρεται μια ετικέτα γλώσσας, η προεπιλεγμένη τοπική ρύθμιση θα είναι εκείνη του χρόνου εκτέλεσης.επιλογές
- ένα αντικείμενο των οποίων οι ιδιότητες χρησιμοποιούνται για την προσαρμογή του μορφοποιητή. Έχει τις ακόλουθες ιδιότητες:
Ιδιοκτησία | Περιγραφή | Πιθανές τιμές |
ημέρα | Ημέρα του μήνα | “Διψήφιο”, “αριθμητικός” |
εποχή | Η εποχή πέφτει, π.χ .: π.Χ. | “στενός”, “μικρός”, “μακρύς” |
formatMatcher | Ο αλγόριθμος που χρησιμοποιείται για την αντιστοίχιση μορφοτύπων | “βασικός”, “ταιριάζει καλύτερα”[Προκαθορισμένο] |
ώρα | Αντιπροσωπεύει ώρες την ώρα | “Διψήφιο”, “αριθμητικός” |
ώρα12 | Δηλώνει μορφή 12 ωρών (αληθής ) ή μορφή 24 ωρών (ψευδής ) | αληθής , ψευδής |
localeMatcher | Ο αλγόριθμος που χρησιμοποιείται για την αντιστοίχιση τοπικών ρυθμίσεων | “ψάχνω”, “ταιριάζει καλύτερα”[Προκαθορισμένο] |
λεπτό | Λεπτά την ώρα | “Διψήφιο”, “αριθμητικός” |
μήνας | Μήνας σε ένα χρόνο | “Διψήφιο”, “αριθμητικός”, “στενός”, “μικρός”, “μακρύς” |
δεύτερος | Δευτερόλεπτα την ώρα | “Διψήφιο”, “αριθμητικός” |
ζώνη ώρας | Χρονική ζώνη για εφαρμογή | “UTC”, Η προεπιλογή είναι η ζώνη ώρας χρόνου εκτέλεσης |
timeZoneName | Ζώνη ώρας της ημερομηνίας | “μικρός”, “μακρύς” |
καθημερινή | Ημέρα την εβδομάδα | “στενός”, “μικρός”, “μακρύς” |
έτος | Έτος της ημερομηνίας | “Διψήφιο”, “αριθμητικός” |
Παράδειγμα:
var formatter = Νέο Intl.DateTimeFormat ('en-GB'); / * επιστρέφει έναν μορφοποιητή που μπορεί να μορφοποιήσει μια ημερομηνία στη μορφή αγγλικής ημερομηνίας Αγγλίας * /
Επιλογές var = ημέρα της εβδομάδας: 'σύντομη'); var formatter = Νέο Intl.DateTimeFormat ('en-GB', επιλογές); / * επιστρέφει έναν μορφοποιητή που μπορεί να μορφοποιήσει μια ημερομηνία στη μορφή Αγγλικής Αγγλικής ημερομηνίας * μαζί με την ημέρα της εβδομάδας σε σύντομη σημείωση όπως «Thu» για την Πέμπτη * /
ο μορφή λειτουργία
Η εμφάνιση του DateTimeFormat
αντικείμενο έχει αποκτήσει πρόσβαση σε ένα στοιχείο πρόσβασης (getter) μορφή
που επιστρέφει μια συνάρτηση που μορφοποιεί a Ημερομηνία
βασισμένο στο locales
και επιλογές
που βρέθηκαν στο DateTimeFormat
παράδειγμα.
Η λειτουργία παίρνει a Ημερομηνία
αντικείμενο ή απροσδιόριστος
ως προαιρετικό όρισμα και επιστρέφει a σειρά
στη μορφή της αιτούμενης ημερομηνίας.
Σημείωση: Αν το επιχείρημα είναι είτε απροσδιόριστος
ή δεν παρέχεται τότε επιστρέφει την τιμή του Date.now ()
στη μορφή της αιτούμενης ημερομηνίας.
Εδώ είναι η σύνταξη:
η νέα μορφή Intl.DateTimeFormat (). () // θα επαναφέρει την τρέχουσα ημερομηνία στη μορφή ημερομηνίας εκτέλεσης
Και τώρα ας κωδικοποιήσουμε μια απλή μορφοποίηση ημερομηνίας.
Ας αλλάξουμε τη γλώσσα και βλέπουμε την έξοδο.
Τώρα, είναι καιρός να εξετάσουμε τις επιλογές.
ο toLocaleDateString μέθοδος
Αντί να χρησιμοποιήσετε έναν μορφοποιητή όπως φαίνεται στα παραπάνω παραδείγματα, μπορείτε επίσης να χρησιμοποιήσετε Date.prototype.toLocaleString
με τον ίδιο τρόπο με το locales
και επιλογές
τα επιχειρήματα είναι παρόμοια, αλλά συνιστάται η χρήση του DateTimeFormat
αντικείμενο όταν αντιμετωπίζετε πάρα πολλές ημερομηνίες στην αίτησή σας.
var mydate = νέα Ημερομηνία ('2015/04/22'); var επιλογές = ημέρα της εβδομάδας: "σύντομη", έτος: "αριθμητική", μήνας: "μεγάλη", ημέρα: "αριθμητική"; console.log (mydate.toLocaleDateString ('en-GB', επιλογές)). // επιστρέφει "Τετ, 22 Απριλίου 2015"
Ελέγξτε εάν το locales υποστηρίζονται
Για να ελέγξετε για τις υποστηριζόμενες locales
, μπορούμε να χρησιμοποιήσουμε τη μέθοδο υποστηριζόμενες γλώσσες
του DateTimeFormat
αντικείμενο. Επιστρέφει μια σειρά από όλες τις τοπικές ρυθμίσεις υποστήριξης ή έναν άδειο πίνακα εάν δεν υποστηρίζεται καμία από τις τοπικές ρυθμίσεις.
Για δοκιμές, ας προσθέσουμε μια εικονική τοπική ρύθμιση “Μπλα” στη λίστα των τοπικών θέσεων που πρόκειται να ελεγχθούν.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh", "blah", "fa-pes"])); // επιστρέφει το Array ["zh", "fa-pes"]
Υποστήριξη προγράμματος περιήγησης
Στα τέλη Απριλίου 2015, μεγάλα προγράμματα περιήγησης υποστηρίζουν το API διεθνοποίησης.
βιβλιογραφικές αναφορές
- ECMA Διεθνής: Προδιαγραφή API διεθνοποίησης ECMAScript
- IANA: Μητρώο δευτερευόντων γλωσσών
- Γωνία Norbert: Το API Διεθνοποίησης ECMAScript