O modalitate definitivă de formatare a datelor pentru site-uri internaționale
Formatele de date variază în funcție de regiune și de limbă, deci este întotdeauna util dacă găsim o modalitate de a afișa datele către utilizatori, specifice limbii și regiunii lor.
Înapoi în decembrie 2012, ECMA a lansat specificațiile API pentru internaționalizare pentru JavaScript. API-ul de internaționalizare ne ajută să afișăm anumite date în funcție de specificația limbajului și cutural. Poate fi folosit pentru a identificați valutele, fusurile orare și altele.
În acest post vom fi în căutarea data de formatare folosind acest API.
Cunoaște locația utilizatorului
Pentru a afișa data pe locația preferată a utilizatorului, mai întâi trebuie să știm ce este localizarea preferată a utilizatorului. În prezent modul în care puteți să știți că este necesar să întrebați utilizatorul; permiteți utilizatorilor să selecteze setările preferate ale limbii și regiunilor din pagina web.
Dar, dacă nu este o opțiune, puteți interpreta Accept-Language cereți antetul sau citiți navigator.language(pentru Chrome și Firefox) sau navigator.browserLanguage(pentru IE).
Vă rugăm să știți că nu toate aceste opțiuni returnează limba preferată a browserului UI.
var language_tag = window.navigator.browserLanguage || window.navigator.language || "En"; // returnează etichete de limbaj ca 'en-GB'
Verificați API pentru internaționalizare
Pentru a ști dacă browserul acceptă sau nu interfața API, putem verifica prezența obiectului global Intl.
în cazul în care (window.hasOwnPropertyâ €‹("Intl") && typeof Intl === "obiect") // API-ul de internaționalizare este prezent, să-l folosim Intl obiect
Intl este un obiect global pentru utilizarea Internaționalizării API. Are trei proprietati care sunt constructori pentru trei obiecte si anume Collator, NumberFormat, și DateTimeFormat.
Obiectul pe care îl vom folosi este DateTimeFormat care ne va ajuta să formăm timpul de dată în funcție de limbile diferite.
DateTimeFormat obiect
DateTimeFormat constructorul ia două argumente opționale;
locales- un șir sau un șir de șiruri de caractere care reprezintă etichetele de limbă, de exemplu; “de” pentru limba germană, “en-GB” pentru engleza utilizată în Regatul Unit. Dacă nu este menționată o etichetă de limbă, localizarea implicită va fi aceea a runtime-ului.Opțiuni- un obiect ale cărui proprietăți sunt utilizate pentru personalizarea formatorului. Are următoarele proprietăți:
| Proprietate | Descriere | Valori posibile |
| zi | Ziua lunii | “2 cifre”, “numeric” |
| eră | Era data cade în, Ex: BC | “îngust”, “mic de statura”, “lung” |
| formatMatcher | Algoritmul utilizat pentru potrivirea formatelor | “de bază”, “cel mai potrivit”[Mod implicit] |
| ora | Reprezintă ore în timp | “2 cifre”, “numeric” |
| hour12 | Indică formatul de 12 ore (Adevărat) sau format 24 de ore (fals) | Adevărat, fals |
| localeMatcher | Algoritmul utilizat pentru potrivirea locale | “privește în sus”, “cel mai potrivit”[Mod implicit] |
| minut | Minute în timp | “2 cifre”, “numeric” |
| lună | Luna într-un an | “2 cifre”, “numeric”, “îngust”, “mic de statura”, “lung” |
| al doilea | Secunde în timp | “2 cifre”, “numeric” |
| fus orar | Fus orar pentru a aplica | “UTC”, implicit este fusul orar de rulare |
| timeZoneName | Fusul orar al datei | “mic de statura”, “lung” |
| zi de lucru | Zi în săptămână | “îngust”, “mic de statura”, “lung” |
| an | Anul datei | “2 cifre”, “numeric” |
Exemplu:
var formatter = noul Intl.DateTimeFormat ('en-GB'); / * returnează un formatator care poate formata o dată în format britanic englezesc * / var opțiuni = zi de lucru: "scurtă"; var formatter = noul Intl.DateTimeFormat ('en-GB', opțiuni); / * returnează un formatator care poate să formateze o dată în format englezesc englezesc * împreună cu ziua de săptămână în notație scurtă ca 'Thu' pentru joi * / format funcţie
Exemplul DateTimeFormat obiect are un accesoriu de proprietate (getter) numit format care returnează o funcție care formatează a Data bazat pe locales și Opțiuni găsite în DateTimeFormat instanță.
Funcția are o funcție Data obiect sau nedefinit ca argument opțional și returnează a şir în formatul datei solicitate.
Notă: Dacă argumentul este fie nedefinit sau nu este furnizat atunci returnează valoarea lui Date.now () în formatul datei solicitate.
Iată sintaxa:
noul format Intl.DateTimeFormat (). () va returna data curentă în formatul datei de rulare
Și acum, să codificăm o formatare simplă a datei.
Să schimbăm limba și să vedem rezultatul.
Acum, este timpul să analizăm opțiunile.
toLocaleDateString metodă
În loc să utilizați un formatator, cum este prezentat în exemplele de mai sus, puteți, de asemenea, să utilizați Date.prototype.toLocaleString în același mod cu locales și Opțiuni argumente, acestea sunt similare, dar se recomandă utilizarea DateTimeFormat obiect atunci când se ocupă de prea multe date din aplicația dvs..
var mydate = new Data ('2015/04/22'); var opțiuni = săptămâna: "scurt", anul: "numeric", luna: "lung", ziua: "numeric"; console.log (mydate.toLocaleDateString ( 'en-GB', opțiuni)); // revine "miercuri, 22 aprilie 2015" Verificați dacă locales sunt suportate
Pentru a verifica suportul acceptat locales, putem folosi metoda supportedLocalesOf de DateTimeFormat obiect. Aceasta returnează o matrice a tuturor localizărilor de sprijin sau a unei matrice goale, dacă niciuna dintre localizări nu este acceptată.
Pentru testare, să adăugăm o locație falsă “bla” în lista locațiilor care trebuie verificate.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh", "blah", "fa-pes"])); // returnează Array ["zh", "fa-pes"]
Suport pentru browser
La sfârșitul lunii aprilie 2015, browserele majore susțin API-ul de interfațare.
Referințe
- ECMA Internațional: Specificație API Internaționalizare ECMAScript
- IANA: Registrul subtagurilor de limbă
- Colțul lui Norbert: API-ul internaționalizării ECMAScript
