Uluslararası Siteler İçin Tarihleri Biçimlendirmenin Kesin Bir Yolu
Tarih biçimleri bölgeye ve dile göre değişir; bu nedenle, tarihleri dillere ve bölgelere özgü olarak kullanıcılara göstermenin bir yolunu bulabilirsek her zaman yardımcı olur..
Aralık 2012'de ECMA, JavaScript için Uluslararasılaşma API'sinin özelliklerini açıkladı. Uluslararasılaştırma API'si, belirli verileri dil ve dil bilgisi özelliklerine göre görüntülememize yardımcı olur. İçin kullanılabilir para birimlerini, zaman dilimlerini tanımlamak ve dahası.
Bu yazıda içine bakıyor olacağız tarih biçimlendirme bu API'yi kullanarak.
Kullanıcının yerel ayarını bilin
Tarihi kullanıcının tercih ettiği yerel ayarlara göre göstermek için önce tercih edilen yerel ayarın ne olduğunu bilmemiz gerekir. Şu anda bunu bilmek için kusursuz yoldan kullanıcıya sormak; kullanıcıların web sayfasında tercih ettikleri dil ve bölge ayarlarını seçmelerine izin ver.
Ancak, bu bir seçenek değilse, yorumlayabilirsiniz Accept-Language
Başlık istemek veya okumak navigator.language
(Chrome ve Firefox için) veya navigator.browserLanguage
(IE için) değerler.
Lütfen bu seçeneklerin tamamının tarayıcı kullanıcı arayüzünde tercih edilen dili döndürmediğini unutmayın..
var language_tag = window.navigator.browserLanguage || window.navigator.language || "Tr"; // 'en-GB' gibi dil etiketlerini döndürür
Uluslararasılaşma API'sini kontrol edin
Tarayıcının Uluslararasılaşma API'sini destekleyip desteklemediğini bilmek için global nesnenin varlığını kontrol edebiliriz Intl
.
if (window.hasOwnPropertyâ €‹("Intl") && typeof Intl === "object") // Uluslararasılaşma API'si var, onu kullanalım
Intl nesne
Intl
Uluslararasılaştırma API'sini kullanmak için global bir nesnedir. Üç nesne için yapıcı olan üç özelliğe sahiptir: Harmanlama
, NumberFormat
, ve DateTimeFormat
.
Kullanacağımız nesne DateTimeFormat
farklı dillere göre tarih saatini biçimlendirmemize yardımcı olacak.
DateTimeFormat nesne
DateTimeFormat
yapıcı iki isteğe bağlı argüman alır;
yerel ayarlar
- dil etiketlerini temsil eden bir dize veya dize dizisi; örneğin; “de” almanca için, “tr-TR” İngiltere'de kullanılan İngilizce için. Bir dil etiketinden bahsedilmezse, varsayılan yerel ayar çalışma zamanınınki olur.seçenekleri
- biçimlendiriciyi özelleştirmek için özellikleri kullanılan bir nesne. Aşağıdaki özelliklere sahiptir:
özellik | Açıklama | Olası değerler |
gün | Ayın günü | “2 basamaklı”, “sayısal” |
çağ | Tarih düşüyor dönemi, Ör: BC | “dar”, “kısa”, “uzun” |
formatMatcher | Format eşleşmesi için kullanılan algoritma | “temel”, “en uygun”[Varsayılan] |
saat | Zamandaki saatleri temsil eder | “2 basamaklı”, “sayısal” |
hour12 | 12 saatlik formatı gösterir (doğru ) veya 24 saat formatı (yanlış ) | doğru , yanlış |
localeMatcher | Yerel eşleştirme için kullanılan algoritma | “yukarı Bak”, “en uygun”[Varsayılan] |
dakika | Zamanda dakika | “2 basamaklı”, “sayısal” |
ay | Bir yıldaki ay | “2 basamaklı”, “sayısal”, “dar”, “kısa”, “uzun” |
ikinci | Zamanda saniye | “2 basamaklı”, “sayısal” |
saat dilimi | Uygulanacak saat dilimi | “UTC”, varsayılan çalışma zamanı saat dilimidir |
timeZoneName | Tarihin saat dilimi | “kısa”, “uzun” |
iş günü | Haftanın günü | “dar”, “kısa”, “uzun” |
yıl | Tarihin yılı | “2 basamaklı”, “sayısal” |
Örnek:
var formatter = new Intl.DateTimeFormat ('en-GB'); / *, İngiltere'deki İngilizce tarih biçiminde bir tarihi formatlayabilen bir formatlayıcı döndürür * /
var options = hafta içi: 'kısa'; var formatter = new Intl.DateTimeFormat ('en-TR', seçenekler); / *, İngiltere İngiliz tarih biçiminde bir tarihi * hafta içi ile birlikte Perşembe günkü 'Thu' gibi kısa gösterimde * biçimlendiren bir biçimlendirici döndürür * /
biçim fonksiyon
Örneği DateTimeFormat
Nesne, bir özellik erişimcisi (alıcı) adlı biçim
hangi biçimlendiren bir işlevi döndürür tarih
göre yerel ayarlar
ve seçenekleri
içinde bulundu DateTimeFormat
örnek.
İşlev bir tarih
nesne veya Tanımsız
isteğe bağlı bir argüman olarak sicim
istenen tarih biçiminde.
Not: Eğer argüman ya Tanımsız
veya sağlanmadıysa, değerini döndürür. Date.now ()
istenen tarih biçiminde.
İşte sözdizimi:
Yeni Intl.DateTimeFormat (). format () // geçerli tarihi çalışma zamanı biçiminde döndürür
Şimdi basit bir tarih formatı kodlayalım.
Dili değiştirelim ve çıktıyı görelim.
Şimdi, seçeneklere bakmak zamanı.
toLocaleDateString yöntem
Yukarıdaki örneklerde gösterildiği gibi bir formatlayıcı kullanmak yerine, aynı zamanda Date.prototype.toLocaleString
aynı şekilde yerel ayarlar
ve seçenekleri
bağımsız değişkenler benzer, ancak kullanılması önerilir. DateTimeFormat
Başvurunuzda çok fazla tarihle uğraşırken nesne.
var mydate = yeni Tarih ('2015/04/22'); var options = hafta içi: "kısa", yıl: "sayısal", ay: "uzun", gün: "sayısal"; console.log (mydate.toLocaleDateString ( 'tr-TR', seçenekler)); // "Çar, 22 Nisan 2015" i gönderir
Eğer test yerel ayarlar Desteklenmektedir
Desteklenenleri kontrol etmek için yerel ayarlar
, yöntemi kullanabiliriz supportedLocalesOf
arasında DateTimeFormat
nesne. Desteklenen yerel ayarların bir dizisini veya yerel ayarlardan hiçbiri desteklenmiyorsa boş bir dizi döndürür.
Test için sahte bir yerel ayar ekleyelim “bla” kontrol edilecek yerler listesinde.
console.log (Intl.DateTimeFormat.supportedLocalesOf (["zh", "fiil", "fa-pes"])); // Array ["zh", "fa-pes"] döndürür
Tarayıcı Desteği
Nisan 2015 sonunda, büyük tarayıcılar Uluslararasılaşma API'sini destekliyor.
Referanslar
- ECMA Uluslararası: ECMAScript Uluslararasılaşma API Şartnamesi
- IANA: Dil Alt Etiket Kayıt Defteri
- Norbert's Corner: ECMAScript Uluslararasılaşma API'si