Para mais artigos, siga meu blog pessoal: https://seven777777.github.io/myblog/
conceito básico
Atualmente, procurei toLocaleString
métodos que possam ser usados para os três tipos de dados a seguir:
- number.toLocaleString ([locales [, opções]]): Retorna a representação de string deste número em uma localidade específica
- array.toLocaleString([locales [, opções]]): Retorna uma string representando os elementos do array
- date.toLocaleString([locales [, options]]): O método retorna a string do objeto de data. O formato da string difere em diferentes idiomas.
Os conceitos básicos parecem normais, mas aqui estão algumas de suas aplicações práticas:
aplicativo
1. Converta algarismos arábicos em algarismos chineses
var num = 1
num.toLocaleString('zh-u-nu-hanidec') // "一"
2. Converta para a milésima casa
var num = 12345678.123
num.toLocaleString() // "12,345,678.123"
Se não quiser ter separadores, você pode especificar useGrouping como false
3. Porcentagem de giro
var num = 1345.2345
num.toLocaleString('zh',{style:'percent'}) // "134,523%"
num.toLocaleString('zh',{style:'percent' , useGrouping: false}) // "134523%"
num.toLocaleString('zh',{style:'percent' , useGrouping: false}) // "134523%"
4. Alterar o símbolo da moeda
var num = 1234.2345
num.toLocaleString('zh',{style:'currency' , currency:'CNY' }) // "¥1,234.23"
num.toLocaleString('ja',{style:'currency' , currency:'JPY' }) // "¥1,234"
num.toLocaleString('zh',{style:'currency' , currency:'CNY' , useGrouping: false , minimumFractionDigits: 3}) // "¥1234.235"
var arr = [1,22,3333]
arr.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' }) // ¥1,¥22,¥3,333
Nota: Para as configurações 3 e 4, os resultados retêm apenas duas casas decimais por padrão, que podem
minimumFractionDigits
ser definidas através deste parâmetro.
5. Especifique o número mínimo de dígitos para números inteiros, o número mínimo e máximo de dígitos decimais e o número de dígitos significativos. Se não houver dígitos suficientes, use 0 para completá-los (usando o método de arredondamento)
let num = 1234.456;
num.toLocaleString('zh', { minimumIntegerDigits: 5 }); //01,234.456
num.toLocaleString('zh', { minimumFractionDigits: 4, useGrouping: false }); //1234.4560
num.toLocaleString('zh', { maximumFractionDigits: 2, useGrouping: false }); //1234.46
num.toLocaleString('zh', { minimumSignificantDigits: 8, useGrouping: false }); //1234.4560
num.toLocaleString('zh', { maximumSignificantDigits: 4, useGrouping: false }); //1234
6. Exibição do tempo de conversão
var date = new Date()
date.toLocaleString() // "2020/9/28 下午5:14:53"
date.toLocaleString('zh',{ hour12: false }) // "2020/9/28 17:14:53"
Explicação de alguns parâmetros
locales: código de idioma abreviado
O parâmetro locales deve ser uma sequência de tags de idioma BCP 47 ou uma matriz contendo diversas tags de idioma. Se o parâmetro locales não for fornecido ou for indefinido, o código do idioma padrão do tempo de execução será usado.
Ele os contém nesta ordem: código do idioma, código do script e código do país, todos separados por hífens.
- "zh-Hans-CN" abreviatura chinesa 'zh'
- "ja-Jp" abreviatura japonesa 'jp'
- “zh-u-nu-hanidec” Número decimal chinês
opções: um objeto
-
style
O estilo a ser usado ao formatardecimal
Indica que o formato de número puro é o valor padrãocurrency
Indica o formato da moedapercent
Formato percentual expresso
-
currency
O símbolo da moeda usado na formatação da moeda (se o estilo for "moeda", o atributo da moeda deverá ser fornecido)USD
DólarEUR
EURCNY
RMB
-
currencyDisplay
Como exibir moeda na formatação de moedasymbol
Use símbolo de moeda localizada, como € (padrão)code
Use códigos de moeda ISOname
Use nomes de moedas localizadas
-
useGrouping
Se deve usar o separador de grupo, padrão: verdadeiro -
minimumIntegerDigits
O número mínimo de dígitos inteiros a serem usados. Os valores possíveis são de 1 a 21, o valor padrão é 1
-
minimumFractionDigits
Número mínimo de casas decimais a utilizar.Os valores possíveis são de 0 a 20;
O padrão é 0 para formatos comuns de números e percentagens;
O padrão é o formato de moeda fornecido pela lista de códigos de moeda ISO 4217 (se não for fornecido na lista, o valor será 2)
-
maximumFractionDigits
O número máximo de casas decimais a serem usadas. Os valores possíveis são de 0 a 20;
O valor padrão para formato numérico puro é
minimumfractiondigits
o maior de 3;O valor padrão do formato de moeda é
minimumfractiondigits
o maior da lista ISO (ou 2 se não for fornecido na lista)O valor padrão do formato percentual é
minimumfractiondigits
o maior entre 0 e -
minimumSignificantDigits
O número mínimo de dígitos significativos a serem usados. Os valores possíveis são de 1 a 21; o valor padrão é 1
-
maximumSignificantDigits
O número máximo de dígitos significativos a serem usados. Os valores possíveis são de 1 a 21
O padrão é mínimo de dígitos significativos
DICA: Se algum dos atributos 8 ou 9 for definido, as configurações de 5, 6 e 7 serão ignoradas.
Abaixo estão algumas date.toLocaleString
configurações relacionadas a
localidades
Ao usar o objeto date toLocaleString
, o primeiro parâmetro indica como as datas são representadas em diferentes fusos horários.
Se não for aprovado, as regras de exibição do fuso horário atual serão usadas por padrão.
var date = new Date();
// en-US(美利坚英语)使用 month-day-year 的顺序展示年月日
date.toLocaleString("en-US") // 9/29/2020, 10:11:54 AM
// en-GB(不列颠英语)使用 day-month-year 顺序展示年月日
date.toLocaleString("en-GB") // 29/09/2020, 10:11:54
// 韩语使用 year-month-day 顺序展示年月日
date.toLocaleString("ko-KR") // 2020. 9. 29. 오전 10:11:54
//在日本,应用可能想要使用日本日历,
//2012 是平成24年(平成是是日本天皇明仁的年号,由1989年1月8日起开始计算直至现在)
date.toLocaleString("ja-JP-u-ca-japanese") // R2/9/29 10:11:54
//中国
date.toLocaleString("zh") //2020/9/29 上午10:11:54
date.toLocaleString() //2020/9/29 上午10:11:54
opções
hour12
Se deve usar o horário de 12 horas (em vez de 24 horas). Os valores possíveis são verdadeiro e falso; o valor padrão depende da localidade.timeZone
fuso horário a ser usadoformatMatcher
o algoritmo de correspondência de formato a ser usado
Exceto o primeiro, não existem muitos outros cenários de uso.
Acima, listei aproximadamente os atributos que considero que podem ser mais úteis, especialmente os atributos para conversão para milésimos e hora.Se você estiver interessado em outros atributos, pode ir ao MDN para verificá-los você mesmo.
Aqui estão alguns portais:
compatibilidade
No momento, a compatibilidade ainda é boa. Para detalhes, você pode conferir aqui: https://caniuse.com/?search=toLocaleString