Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
javascript internationalization API
Search
Taketoshi Aono(青野健利 a.k.a brn)
August 27, 2019
Programming
0
850
javascript internationalization API
EcmascriptのInternationalization APIについて
Taketoshi Aono(青野健利 a.k.a brn)
August 27, 2019
Tweet
Share
More Decks by Taketoshi Aono(青野健利 a.k.a brn)
See All by Taketoshi Aono(青野健利 a.k.a brn)
document.write再考
brn
6
3k
Parsing Javascript
brn
14
9.1k
JSON & Object Tips
brn
1
460
CA 1Day Youth Bootcamp for Frontend LT
brn
0
900
Modern TypeScript
brn
2
780
javascript - behind the scene
brn
3
720
tc39 proposals
brn
0
840
プロダクト開発とTypeScript
brn
8
2.9k
React-Springでリッチなアニメーション
brn
1
670
Other Decks in Programming
See All in Programming
Denoでフロントエンド開発 2025年春版 / Frontend Development with Deno (Spring 2025)
petamoriken
1
1.3k
Django for Data Science (Boston Python Meetup, March 2025)
wsvincent
0
230
신입 안드로이드 개발자의 AI 스타트업 생존기 (+ Native C++ Code를 Android에서 사용해보기)
dygames
0
500
プログラミング教育のコスパの話
superkinoko
0
120
SQL Server ベクトル検索
odashinsuke
0
110
フロントエンドテストの育て方
quramy
9
2.5k
AI Agentを利用したAndroid開発について
yuchan2215
0
210
RubyKaigiで手に入れた HHKB Studioのための HIDRawドライバ
iberianpig
0
1k
SLI/SLOの設定を進めるその前に アラート品質の改善に取り組んだ話
tanden
2
710
Going Structural with Named Tuples
bishabosha
0
170
Preact、HooksとSignalsの両立 / Preact: Harmonizing Hooks and Signals
ssssota
1
660
ベクトル検索システムの気持ち
monochromegane
30
8.8k
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Building Flexible Design Systems
yeseniaperezcruz
328
38k
Why Our Code Smells
bkeepers
PRO
336
57k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
21k
Git: the NoSQL Database
bkeepers
PRO
429
65k
Gamification - CAS2011
davidbonilla
81
5.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.1k
Bash Introduction
62gerente
611
210k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.7k
Product Roadmaps are Hard
iamctodd
PRO
52
11k
KATA
mclloyd
29
14k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Transcript
Javascript Internationalization API
Name !CSO 5BLFUPTIJ"POP੨݈ར Occupation 'SPOUFOE%FWFMPQFS1SPEVDU0XOFS Company $ZCFSBHFOU"EUFDI4UVEJP"*.FTTFOHFS OSS $POUSJCVUPSPG7
About IUUQJOGPCODI
&DNB &DNB͕&DNBͱͯ͠*OUFSOBUJPOBMJ[BUJPO"1*ͷ༷ࡦఆΛߦ͍ͬͯΔ &DNBͰ͋Δ&DNBTDSJQU +BWBTDSJQU ͕&DNBΛแ͓ͯ͠Γ &DNBTDSJQUଆʹJOͷ࣮͕ఏڙ͞ΕΔ ͪͳΈʹ+40/&DNBͰఆٛ͞Ε͓ͯΓɺ&DNBʹแ͞Ε͍ͯΔ
*OUM *OUFSOBMJ[BUJPO"1**OUMͱ͍͏άϩʔόϧΦϒδΣΫτΛެ։͓ͯ͠Γ ͦͷΦϒδΣΫτܦ༝Ͱ֤छ"1*ʹΞΫηε͢Δ͜ͱ͕Ͱ͖Δ ࠓͦͷத͔Βදతͳͭͷ"1*Λհ
*OUM$PMMBUPS
*OUM$PMMBUPS *OUM$PMMBUPSओʹจࣈྻൺֱΛߦ͏ͨΊͷ"1* ֤MPDBMFΛؾʹ͠ͳ͕Β6OJDPEFʹجͮ͘ෳࡶͳจࣈൺֱΛߦͬͯ͘ΕΔ
console.log(new Intl.Collator().compare('a', ‘c')); // → a negative value console.log(new Intl.Collator().compare('c',
'a')); // → a positive value console.log(new Intl.Collator().compare('a', 'a')); // → 0
new Intl.Collator('gr',{sensitivity: ‘base'}) .compare(‘ς', 'σ') // → 0 // ΪϦγϟޠͷγάϚจͱจதͰจࣈίʔυ͕ҟͳΔ
// CollatorΛ͏ͱɺsensitivityͷࢦఆͰൺֱͷৄࡉ Λઃఆͯ͜͠ͷΑ͏ͳෳࡶͳൺֱ͕Ͱ͖Δ
*OUM/VNCFS'PSNBU
*OUM/VNCFS'PSNBU *OUM/VNCFS'PSNBUMPDBMFʹԠͨ͡ͷॲཧΛߦ͏"1* EFDJNBMͱDVSSFODZʢ͓ۚʣͷͭʹରԠ
var number = 123456.789; // υΠπͰΧϯϚΛখɺϐϦΦυΛઍ୯Ґͷ۠Γʹ༻͍Δ console.log(new Intl.NumberFormat('de-DE').format(number)); // →
123.456,789 // ΠϯυͰthousands/lakh/crore۠Γ͕༻͍Δ console.log(new Intl.NumberFormat('en-IN').format(number)); // → 1,23,456.789 // nu֦ுΩʔʹΑΓࣈͳͲͷ൪߸ํ͕ࣜ͑Δ console.log(new Intl.NumberFormat(‘zh-Hans-CN-u-nu-hanidec') .format(number)); // → Ұೋࡾ,࢛ޒ.ࣣീ
var number = 123456.789; // ௨՟ϑΥʔϚοτΛ༻͍Δ console.log(new Intl.NumberFormat(‘de-DE', { style:
'currency', currency: 'EUR' } ).format(number)); // → 123.456,79 € console.log(new Intl.NumberFormat(‘ja-JP', { style: 'currency', currency: 'JPY' } ).format(number)); // → ˇ123,457
*OUM1MVSBM3VMFT
*OUM/VNCFS'PSNBU ୯ޠͷෳܗͷॲཧΛߦ͏"1*
var pr = new Intl.PluralRules('en-US'); pr.select(0); // → ‘other’ ෳܗ
pr.select(1); // → ‘one' ୯ܗ pr.select(2); // → ‘other' ෳܗ
const type = pr.select(count); const wordIndices = {'other': 'dogs', 'one':
'dog'}; const verbIndices = {'other': 'are', 'one': 'is'}; console.log( `Your ${indices[type]} ${verbIndices[type]} cute.` ) // count === 1 Your dog is cute. // count === 0 || count > 1 Your dogs are cute.
const ordIndices = { 'one': 'st', 'two': 'nd', 'few': 'rd',
'other': 'th' } const pr = new Intl.PluralRules('en-US', {type: ‘ordinal'} ); const ord = pr.select(3); // → few console.log(`3${ordIndices[ord]}`); // → 3rd
*OUM%BUFUJNF'PSNBU
*OUM%BUFUJNF'PSNBU MPDBMFʹԠͨ͡ͱ࣌ࠁͷॲཧΛߦ͏"1*
new Intl.DateTimeFormat('ja-JP', { year: 'numeric', month: 'long', day: 'numeric', hour:
'numeric', minute: 'numeric', second: 'numeric', hour12: false} ).format(new Date()) // → 20198݄27 16:47:50
new Intl.DateTimeFormat('ja-JP', { month: 'long', day: 'numeric', hour: 'numeric', hour12:
false} ).format(new Date()) // → 8݄27 16࣌
*OUM%BUFUJNF'PSNBU GPSNBU5P1BSUTͱ͍͏ϝιουΛ͏͜ͱͰಠࣗͷϑΥʔϚοτ࣮ݱͰ͖ Δ
new Intl.DateTimeFormat('ja-JP', { year: 'numeric', month: 'long', day: 'numeric', hour:
'numeric', minute: 'numeric', second: 'numeric', hour12: false} ).formatToParts(new Date())
[ { "type": "year", "value": "2019" }, { "type": "literal",
"value": "" }, { "type": "month", "value": "8" }, { "type": "literal", "value": "݄" }, { "type": "day", "value": "27" }, { "type": "literal", "value": " " }, { "type": "hour", "value": "16" }, { "type": "literal", "value": ":" }, { "type": "minute", "value": "57" }, { "type": "literal", "value": ":" }, { "type": "second", "value": "38" } ]
·ͱΊ *&͔Β͑ΔͷͰੋඇ͓ࢼ͠Λ