JavaScript Internationalization API (I18N)는 무엇입니까?
- Joseph Gordon-Levitt원래의
- 2025-02-10 10:52:09167검색
키 포인트
JavaScript Internationalization API (I18N)는 다양한 언어와 문화적 규범을 지원함으로써 글로벌 청중에게 웹 응용 프로그램의 적응을 촉진합니다.
API에는 및
와 같은 함수가 포함되어 있으며,이 기능은 사용자에게 친숙한 형식으로 정보를 제시하기 위해 로케일 식별자를 수락합니다.
- 국제화 (i18n)는 까다로울 수 있습니다
-
라틴어 기반 언어는 표면에서 비슷할 수 있습니다. 예를 들어, 이름, 이메일 및 날짜를 요청하기위한 양식은 다음과 같이 번역됩니다. - "name"
Intl.RelativeTimeFormat를 동적으로 대체합니다. 불행히도 이것은 사용자 인터페이스 문제가 나타나기 시작하는 곳입니다.- 한 언어로 된 단어는 다른 언어에서 훨씬 더 오래 커질 수 있습니다. 예를 들어, "이메일"은 러시아어로 "э 잘ектроннное письмо"로 변환됩니다.
-
혼란이라는 용어 응용 프로그램이 날짜, 시간, 숫자, 통화 또는 단위를 표시해야 할 때 추가 혼란이 발생합니다.
동일한 언어의 변형이 다를 수 있습니다. 스페인의 스페인어 사용은 남미와 정확히 동일하지 않습니다. 텍스트가 항상 왼쪽에서 오른쪽으로 정렬되는 것은 아닙니다. 일부는 아랍어, 히브리어, 쿠르드족 및 이디시와 같은 오른쪽에서 왼쪽으로 작성되었습니다. 중국어, 한국, 일본 및 대만과 같은 다른 언어는 위에서 아래로 쓸 수 있습니다. 텍스트를 최소로 유지하고 방향, 쓰기 패턴 및 논리적 차원과 같은 CSS 속성으로 배치하여 많은 문제를 해결할 수 있습니다. 날짜를 "12/03/24"로 표시하는 것을 고려하십시오. MDY 형식을 사용하는 거주자는 "2024 년 12 월 3 일"으로 해석합니다.
유럽, 남아메리카 및 아시아 거주자 DMY 형식의 거주자는이를 "2024 년 3 월 12 일", 로 해석했습니다. 보다 실용적인 YMD 형식을 사용하는 캐나다, 중국, 일본 및 헝가리 거주자는이를“2012 년 3 월 24 일”로 해석 할 것입니다.
(날짜 분리기 슬래시가 모든 언어에서 일반적으로 사용되는 것은 아닙니다!) "1,000"숫자는 다음과 같이 해석됩니다미국, 영국, 캐나다, 중국 및 일본 출신의 사람들은이를 "천"으로 해석 할 것입니다. 스페인, 프랑스, 독일 및 러시아의 사람들은이 국가의 소수점 분획이 쉼표로 분리되기 때문에이를 "1 (포인트 제로)으로 해석 할 것입니다.
미국 거주자의 경우 1 km (또는 0.62 mi) 영국, 캐나다 및 호주의 사람들에게는 수천 개의 측정 기기 모음입니다!영어만으로도 상황은 복잡 할 수 있습니다. "1,000 미터"라는 용어는 다음을 의미합니다 -
javaScript intl api 거의 알려지지 않은 JavaScript intl 객체는 대부분의 최신 브라우저 및 런타임에서 ECMAScript 국제 API를 구현합니다. 지원은 일반적으로 좋으며 IE11조차도 더 유용한 방법이 많이 있습니다. 구형 브라우저의 경우 폴리 필이 있고 다음과 같이 API가 감지 될 수 있습니다. - API는 약간 특이합니다. 날짜, 시간, 숫자 및 구성 매개 변수가 포함 된 선택 객체를 통과하는 일부 객체 생성자를 제공합니다. 예를 들어, 이것은 American English를 지정하는 DateTime 객체입니다.
이 객체는 날짜 () 값 (또는 사용 가능한 es6 시간)을 전달하는 다양한 메소드를 호출하는 데 여러 번 사용할 수 있습니다. 형식 방법은 일반적으로 가장 실용적인 옵션입니다. 예를 들면 :
형식 () 메소드 외에도 일부 개체는 다음 방법을 지원합니다. formattoparts () : 형식이 포함 된 문자열이 포함 된 객체 배열을 반환합니다. resolvedOptions () : dateformatter.resolvedOptions (). Locale과 같은 로케일 및 서식 옵션을 반영하는 새 개체가 포함 된 새 개체를 반환합니다. 로케일을 정의하십시오 문자열을 사용하는 것 외에도 intl.locale 객체를 사용하여 12 시간 형식으로 미국 영어와 같은 로케일을 건설 할 수도 있습니다. 이것은 다른 INTL 생성자에서 사용할 수 있습니다. 예를 들면 : 로케일이 정의되지 않으면 장치의 현재 언어 및 지역 설정이 사용됩니다. 예를 들면 : -
이것은 미국에 설정된 장치에서 "5/4/2022"를 반환하고 영국에 설정된 장치에서 "04/05/2022"를 반환합니다.
-
날짜와 시간
다음 도구는 intl.dateTimeFormat ()를 사용하여 형식화 된 날짜 및 시간의 예를 보여줍니다 (언어 나 지역이 나열되지 않으면 깊이 죄송합니다!) : .
-
생성자는 로케일 및 옵션 객체를 통과합니다. 데이터 스타일 및/또는 타임 스타일을 초과 할 필요는 없지만 이에 대한 가능한 많은 속성이 있습니다. (여기에는 테이블이어야하지만 테이블을 직접 만들 수 없으므로 텍스트 설명 만 제공 할 수 있습니다.) 테이블에는 , , , , - >, , , ,
(Codepen 예제는 여기에 포함되어야하지만 외부 리소스를 직접 포함시킬 수 없으므로 텍스트 설명 만 제공 할 수 있습니다.) Codepen 예제 Codepen 예제는 다른 지역에서 날짜와 시간을 형식화하는 여러 가지 방법을 보여줍니다. 다른 날짜 스타일 (Full, Long, Medium, Short) 및 시간 스타일 (전체, 길, 중간, 짧음) 및 달력, 시간대 등과 같은 기타 옵션을 포함한 . , - , , ,
- , , , ,
Intl.DateTimeFormat()
Intl.NumberFormat()
더 간단한 경우에는 일부 토큰 화 양식을 사용할 수 있습니다. 예를 들어 다음이 포함 된 HTML 템플릿을 사용하십시오.
,
, , 등<code><label> for="name"></label>{{ NAME }}>
</code>
예 :
날짜 범위<code>if (window.Intl) {
// Intl 受支持
}
</code> formatrange () 메소드는 로케일 및 옵션에 따라 두 개의 날짜와 기간을 가장 간결한 방식으로 형식으로 형식화합니다. 예를 들면 : 이 방법은 더 작은 브라우저 지원 범위를 가지고 있지만 Chrome 76에서 구현됩니다.
<code>const dateFormatter = new Intl.DateTimeFormat('en-US');
</code> 상대 기간
, , , ,
> 기다립니다.format () 메소드는 값과 단위를 전달합니다. 예 : <..>
디지털, 통화, 백분율 및 단위Intl.RelativeTimeFormat(), , localeMatcher, 를 사용하는 언어 >, , numeric, style, , , , 🎜>,
,<code><label> for="name"></label>{{ NAME }}>
</code>, 등
생성자는 로케일 및 옵션 객체를 통과합니다 :
(여기에는 테이블이어야하지만 테이블을 직접 만들 수 없으므로 텍스트 설명 만 제공 할 수 있습니다.) 테이블에는
, , , , >,
, , ,Intl.NumberFormat(), notation, , currency, currencyDisplay, , , unit, unitDisplay, useGrouping, 등 minimumIntegerDigits
minimumFractionDigits 예 :
maximumFractionDigits
minimumSignificantDigits 목록
예 :
, , 등
JavaScript Internationalization API (i18n) FAQ (FAQ)
예, DateTimeFormat, NumberFormat 또는 Collator 객체를 작성할 때 여러 로컬을 배열로 지정할 수 있습니다. JavaScript i18N은 배열에서 지원하는 첫 번째 로케일을 사용합니다. 이는 여러 지역에서 사용되는 응용 프로그램에 매우 유용합니다. 다른 지역의 언어 및 형식 규칙에 적응할 수 있으므로 이는 매우 유용합니다.
예, JavaScript i18n은 다른 JavaScript API와 함께 사용할 수 있습니다. 예를 들어, DateTimeFormat 객체가있는 날짜 개체를 형식 날짜에 사용하거나 숫자 객체가있는 숫자 객체를 형식 숫자로 사용할 수 있습니다. 이를 통해 JavaScript의 힘을 활용하여 응용 프로그램을 국제화 할 수 있습니다.
Intl.NumberFormat() 복수
<code><label> for="name"></label>{{ NAME }}>
</code> 이익!
Intl.Collator()
collation
numeric
위 내용은 JavaScript Internationalization API (I18N)는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!