toLocaleString é tão fácil de usar! (Super conveniente para converter para milésimos, números chineses, etc.)

Para mais artigos, siga meu blog pessoal: https://seven777777.github.io/myblog/

conceito básico

Atualmente, procurei toLocaleStringmétodos que possam ser usados ​​para os três tipos de dados a seguir:

  1. number.toLocaleString ([locales [, opções]]): Retorna a representação de string deste número em uma localidade específica
  2. array.toLocaleString([locales [, opções]]): Retorna uma string representando os elementos do array
  3. 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 minimumFractionDigitsser 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
  1. styleO estilo a ser usado ao formatar

    • decimalIndica que o formato de número puro é o valor padrão
    • currencyIndica o formato da moeda
    • percentFormato percentual expresso
  2. currencyO símbolo da moeda usado na formatação da moeda (se o estilo for "moeda", o atributo da moeda deverá ser fornecido)

    • USDDólar
    • EUREUR
    • CNYRMB
  3. currencyDisplayComo exibir moeda na formatação de moeda

    • symbolUse símbolo de moeda localizada, como € (padrão)
    • codeUse códigos de moeda ISO
    • nameUse nomes de moedas localizadas
  4. useGroupingSe deve usar o separador de grupo, padrão: verdadeiro

  5. 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

  6. 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)

  7. 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 é minimumfractiondigitso maior de 3;

    O valor padrão do formato de moeda é minimumfractiondigitso maior da lista ISO (ou 2 se não for fornecido na lista)

    O valor padrão do formato percentual é minimumfractiondigitso maior entre 0 e

  8. 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

  9. 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.toLocaleStringconfiguraçõ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
  1. hour12Se 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.
  2. timeZonefuso horário a ser usado
  3. formatMatchero 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:

data.toLocaleString

número.toLocaleString

array.toLocaleString

compatibilidade

No momento, a compatibilidade ainda é boa. Para detalhes, você pode conferir aqui: https://caniuse.com/?search=toLocaleString

Pegando sonhos
Bem-vindo, preste atenção à minha conta pública pessoal [搴Fang Shimeng]

Acho que você gosta

Origin blog.csdn.net/Seven521m/article/details/108866881
Recomendado
Clasificación