Como formatar um número com vírgulas como mil separadores?
Ao executar conversões em JavaScript, pode haver um requisito para aplicá -lo de uma maneira específica. Por exemplo, denotando um número complexo de tal forma que se torna fácil de entender. Nos cenários, formatando um número com vírgulas como os mil separadores em JavaScript auxiliam na contagem e análise do resultado resultante efetivamente.
Este blog indicará as abordagens para formatar um número com vírgulas como os mil separadores em JavaScript.
Como formatar/configurar um número em javascript com vírgulas como mil separadores?
Para formatar/configurar um número com vírgulas como milhares de separadores em JavaScript, considere as seguintes abordagens:
- ““Tolocalestring ()”Método.
- ““formatar()”Método e“Formato numérico()”Construtor.
- ““substituir()”Método e“Expressão regular" padrão.
Método 1: Formate/configure um número com vírgulas como milhares de separadores usando o método tolocalestring () em javascript
O "Tolocalestring ()”O método fornece um objeto de data em forma de string. Este método é usado para formatar um número baseado no formato de linguagem especificado.
Sintaxe
documento.tolocalestring (locais, opções)
Nesta sintaxe:
- ““Locais”Refere -se ao formato de linguagem que precisa ser usado.
- ““opções”É um objeto onde as propriedades podem ser definidas.
Exemplo
Vamos passar pelo exemplo abaixo do ponto:
Nas linhas de código acima.
- Em primeiro lugar, armazene o número na variável chamada “n”.
- Na próxima etapa, aplique o “Tolocalestring ()”Método e atribua o formato de linguagem como“en-us” .
- Isso, resultado, exibirá o número especificado no formato declarado separado por vírgulas.
Saída
Na saída, pode -se observar que as vírgulas estão incluídas no número fornecido com base no formato especificado.
Método 2: formatar/configurar um número com vírgulas como milhares de separadores via método format () e intl.Construtor numberFormat () em javascript
O "formatar()”O método fornece uma sequência formatada com base nos parâmetros fornecidos no“Intl" e a "Intl.Formato numérico()”Construtor cria o INTL.Objetos NumberFormat que configuram a formatação do número sensível ao idioma. Essas abordagens podem ser utilizadas para formatar o número fornecido com base em um formato de idioma específico.
Sintaxe
Intl.NumberFormat (locais, opções)
Na sintaxe acima mencionada:
- ““Locais”Refere -se ao formato específico da linguagem.
- ““opções”Corresponde ao objeto que compreende as propriedades.
Exemplo
Vamos dar uma olhada no exemplo abaixo do momento:
Aqui:
- No código HTML, inclua um título que exibirá o número formatado.
- No código JS, insira o número do usuário que precisa ser formatado via prompt.
- Na próxima etapa, aplique o “Formato numérico()”Construtor para criar um objeto com o formato de linguagem declarado, eu.e., (en-us)
- Depois disso, aplique o “formatar()”Método que retorna o número resultante com base no formato especificado.
- Por fim, acesse o cabeçalho incluído usando o “getElementById ()”Método e exiba o resultado via cabeçalho usando o“Innerhtml" propriedade.
Saída
Pode-se observar que o número definido pelo usuário é formatado com base no formato de linguagem especificado.
Método 3: formate um número com vírgulas como milhares de separadores em javascript usando o método replate () e padrão de expressão regular
O "substituir()”O método procura uma sequência específica para o valor e a substitui pelo novo valor, e o“Expressão regular”Pattern faz uma pesquisa global com base na condição como seu parâmetro. Essas abordagens podem ser aplicadas para procurar os dígitos globalmente e colocar as vírgulas nos índices especificados.
Sintaxe
corda.Substitua (SearchValue, NewValue)
Na sintaxe acima:
- ““SearchValue”Refere -se ao valor que precisa ser pesquisado.
- ““novo valor”Corresponde ao valor que precisa ser substituído.
Padrão regex “/\ b (?= (/d 3)+(?!\ d))/g ”para pesquisa global
- ““/… /G”: Permite a criação de uma expressão regular que corresponde a todas as instâncias de um padrão.
- ““\ B”: Isso significa que o primeiro número na string não corresponde.
- ““(?= (…))”: Fornece uma análise prospectiva.
- ““(/d 3)”: Ele captura três dígitos.
- ““(?!\ d)”: Ele faz uma aparência atrasada e corresponde a algo que não é seguido por dígitos.
Exemplo
Vamos passar pelo exemplo abaixo:
No trecho de código acima:
- Em primeiro lugar, inclua o “”Tag para especificar um rótulo.
- Na próxima etapa, inclua um “”Elemento que levará a entrada como“números" apenas.
- Além disso, crie um botão com um anexo “ONCLICKEvento para invocar a função chamada “MyFunction ()”.
- O adicionado “”A tag é especificada para conter o resultado resultante.
- No código JavaScript, declare uma função chamada “MyFunction ()”.
- Na definição da função, acesse o alocado “entrada“Campo através do“getElementById ()”Método.
- Depois disso, aplique o “substituir()”Método, juntamente com o padrão de expressão regular para formatar/configurar o número especificado com as vírgulas após três lugares.
- Finalmente, acesse o “”Tag por sua“eu ia”Usando o“getElementById ()”Método e anexar o resultado resultante nele.
Saída
Nesta saída em particular, é evidente que a expressão regular entrou em vigor corretamente e o número é formatado com vírgulas a cada mil ocorrências.
Conclusão
Para formatar/configurar um número com vírgulas como mil separadores usando JavaScript, use o “Tolocalestring ()”Método, o“formatar()”Método com o“Intl.Formato numérico() ”Construtor, ou o“substituir()”Método com“Expressão regular" padrão. As duas primeiras abordagens simplesmente formatam o número fornecido e o número definido pelo usuário com base no formato de idioma específico. A última abordagem procura globalmente o valor e o substitui com base no padrão de expressão regular. Este artigo discutiu as abordagens para formatar/configurar um número com vírgulas como mil separadores usando JavaScript.