Lopullinen tapa muotoilla kansainvälisten sivustojen päivämääriä
Päivämäärämuodot vaihtelevat alueen ja kielen mukaan, joten on aina hyödyllistä, jos löydämme tavan näyttää päivämäärät käyttäjille omalla kielellään ja alueellaan.
Joulukuussa 2012 ECMA julkaisi JavaScriptin kansainvälistymis API: n eritelmät. Kansainvälistymis API auttaa meitä näyttämään tiettyjä tietoja kielen ja leikkauksen määrittelyn mukaan. Sitä voidaan käyttää tunnistaa valuutat, aikavyöhykkeet ja enemmän.
Tässä viestissä tarkastelemme päivämäärän muotoilu käyttää tätä API: ta.
Tunne käyttäjän sijainti
Jos haluat näyttää päivämäärän käyttäjän ensisijaisen sijainnin mukaan, meidän on ensin tiedettävä, mikä on suosituin alue. Tällä hetkellä foolproof tapa tietää, että on kysyä käyttäjältä; anna käyttäjien valita haluamasi kieli- ja alueasetukset verkkosivulla.
Mutta jos se ei ole vaihtoehto, voit tulkita sitä Accept-Language pyydä otsikkoa tai lue navigator.language(Chrome ja Firefox) tai navigator.browserLanguage(IE-arvot).
Huomaa, että kaikki näistä vaihtoehdoista eivät palauta selaimen käyttöliittymän ensisijaista kieltä.
var language_tag = window.navigator.browserLanguage || window.navigator.language || "Fi"; // palauttaa kielitunnisteet kuten 'en-GB'
Tarkista kansainvälistymisen API
Jos haluat tietää, tukeeko selain kansainvälistymisen sovellusliittymää vai ei, voimme tarkistaa globaalin objektin läsnäolon intl.
jos (window.hasOwnPropertyâ €‹("Intl") & & tyyppi Intl === "objekti") // Kansainvälistymis API on läsnä, käytämme sitä intl esine
intl on kansainvälinen sovellusliittymän käyttäminen. Siinä on kolme ominaisuutta, jotka ovat rakentajia kolmelle esineelle kollaattorin, NumberFormat, ja DateTimeFormat.
Objekti, jota käytämme, on DateTimeFormat joka auttaa meitä asettamaan päivämäärän ajan eri kielille.
DateTimeFormat esine
DateTimeFormat rakentaja ottaa kaksi valinnaista argumenttia;
locales- merkkijono tai joukko merkkijonoja, jotka edustavat esimerkiksi kielitunnisteita; “de” saksan kielelle, “en-GB” englantia käytetään Yhdistyneessä kuningaskunnassa. Jos kielimerkkiä ei mainita, oletussijainti on runtime.vaihtoehtoja- objekti, jonka ominaisuuksia käytetään muotoilijan mukauttamiseen. Sillä on seuraavat ominaisuudet:
| omaisuus | Kuvaus | Mahdolliset arvot |
| päivä | Kuun päivä | “2-numeroinen”, “numeerinen” |
| aikakausi | Era päivämäärä kuuluu, esim. BC | “kapea”, “lyhyt”, “pitkä” |
| formatMatcher | Alustaa, jota käytetään formaatin sovittamiseen | “perustiedot”, “parhaiten sopiva”[oletusarvo] |
| tunnin | Edustaa aikaa | “2-numeroinen”, “numeerinen” |
| hour12 | Ilmaisee 12 tunnin muodon (totta) tai 24 tunnin muodossa (väärä) | totta, väärä |
| localeMatcher | Lokalisointia varten käytetty algoritmi | “Katso ylös”, “parhaiten sopiva”[oletusarvo] |
| minuutti | Pöytäkirja aikaa | “2-numeroinen”, “numeerinen” |
| kuukausi | Kuukausi vuodessa | “2-numeroinen”, “numeerinen”, “kapea”, “lyhyt”, “pitkä” |
| toinen | Sekuntia ajankohtana | “2-numeroinen”, “numeerinen” |
| aikavyöhyke | Aikavyöhyke sovelletaan | “UTC”, oletuksena on runtime time zone |
| timeZoneName | Päivämäärän aikavyöhyke | “lyhyt”, “pitkä” |
| arkipäivä | Päivä viikolla | “kapea”, “lyhyt”, “pitkä” |
| vuosi | Päivämäärä | “2-numeroinen”, “numeerinen” |
Esimerkki:
var formatter = uusi Intl.DateTimeFormat ('en-GB'); / * palauttaa muotoilijan, joka voi muotoilla päivämäärän englanniksi English date format * / var options = weekday: 'short'; var formatter = uusi Intl.DateTimeFormat ('en-GB', asetukset); / * palauttaa muotoilijan, joka voi muotoilla päivämäärän UK: n englanninkielisessä päivämäärämuodossa * sekä viikonpäivän lyhyellä merkinnällä kuten "Thu" torstaina * / muoto toimia
Esimerkkinä DateTimeFormat objektilla on ominaisuusosoite (getter) muoto joka palauttaa funktion, joka muodostaa a Treffi perustuu locales ja vaihtoehtoja löydetty DateTimeFormat ilmentymä.
Toiminto vie a Treffi objekti tai määrittelemätön valinnaisena argumenttina ja palauttaa a jono haluamasi päivämäärän muodossa.
Huomautus: Jos väite on myös määrittelemätön tai ei toimiteta, sitten se palauttaa arvon Date.now () haluamasi päivämäärän muodossa.
Tässä on syntaksi:
uusi Intl.DateTimeFormat () .formaatti () // palauttaa nykyisen päivämäärän runtime date -muodossa
Anna nyt koodata yksinkertainen päivämäärän muotoilu.
Muuta kieli ja näe tulos.
Nyt on aika tarkastella vaihtoehtoja.
toLocaleDateString menetelmä
Sen sijaan, että käytät edellä mainituissa esimerkeissä esitettyä muotoilijaa, voit myös käyttää Date.prototype.toLocaleString samalla tavalla locales ja vaihtoehtoja väitteet, ne ovat samankaltaisia, mutta on suositeltavaa käyttää DateTimeFormat käsitellään liian monta päivämäärää sovelluksessa.
var mydate = new Päiväys ('2015/04/22'); var options = arkipäivä: "lyhyt", vuosi: "numeerinen", kuukausi: "pitkä", päivä: "numeerinen"; console.log (mydate.toLocaleDateString ( 'fi-FI', optiot)); // palaa "ke, 22.4.2015" Testaa, onko locales tuetaan
Voit tarkistaa tuetun locales, voimme käyttää menetelmää supportedLocalesOf of DateTimeFormat esine. Se palauttaa joukon kaikkia tukevia paikkoja tai tyhjän taulukon, jos mitään paikallista ei tueta.
Testattavaksi lisätkäämme nukke “blaa” luettelossa tarkastettavien paikkojen luettelosta.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh", "blah", "fa-pes"])); // palauttaa Array ["zh", "fa-pes"]
Selaimen tuki
Huhtikuun 2015 lopussa suuret selaimet tukevat kansainvälistymis API: ta.
Viitteet
- ECMA International: ECMAScriptin kansainvälistymisen API-määrittely
- IANA: Language Subtag -rekisteri
- Norbertin kulma: ECMAScriptin kansainvälistymis API
