Javascript千位分隔符/字符串格式

时间:2010-09-20 16:35:05

标签: javascript string numbers format

Javascript中是否有用于格式化数字和字符串的函数?

我正在为字符串或数字寻找千位分隔符... (像c#中的String.Format一样)

15 个答案:

答案 0 :(得分:120)

如果是关于本地化千位分隔符,分隔符和小数分隔符,请执行以下操作:

// --> numObj.toLocaleString( [locales [, options] ] )
parseInt( number ).toLocaleString();

您可以使用多种选项(甚至是具有后备的区域设置):

number = 123456.7089;

result  = parseInt( number ).toLocaleString() + "<br>";
result += number.toLocaleString( 'de-DE' ) + "<br>";
result += number.toLocaleString( 'ar-EG' ) + "<br>";
result += number.toLocaleString( 'ja-JP', { 
  style           : 'currency',
  currency        : 'JPY',
  currencyDisplay : 'symbol',
  useGrouping     : true
} ) + "<br>";
result += number.toLocaleString( [ 'jav', 'en' ], { 
  localeMatcher            : 'lookup',
  style                    : 'decimal',
  minimumIntegerDigits     : 2,
  minimumFractionDigits    : 2,
  maximumFractionDigits    : 3,
  minimumSignificantDigits : 2,
  maximumSignificantDigits : 3
} ) + "<br>";

var el = document.getElementById( 'result' );
el.innerHTML = result;
<div id="result"></div>

MDN info page的详细信息。

修改:评论员@I like Serena添加以下内容:

  

要支持我们仍需要英文格式的非英语语言环境的浏览器,请使用value.toLocaleString('en')。也适用于浮点。

答案 1 :(得分:109)

更新(7年后)

以下原始答案中引用的参考文献是错误的。 是一个内置函数,这正是kaiser建议的:toLocaleString

所以你可以这样做:

(1234567.89).toLocaleString('en')              // for numeric input
parseFloat("1234567.89").toLocaleString('en')  // for string input

下面实现的功能也有效,但根本不需要。

(我想也许我很幸运,发现它在2010年 是必要的,但是没有。根据这个more reliable reference,toLocaleString已成为标准的一部分ECMAScript第3版[1999],我相信这意味着它可以支持IE 5.5。)


原始答案

根据this reference,没有用于向数字添加逗号的内置函数。但该页面包含了一个如何自己编写代码的示例:

function addCommas(nStr) {
    nStr += '';
    var x = nStr.split('.');
    var x1 = x[0];
    var x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
            x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}

修改 换句话说(用逗号将字符串转换为数字),你可以这样做:

parseFloat("1,234,567.89".replace(/,/g,''))

答案 2 :(得分:28)

  

根据ECMAScript2018更改使用后视支持进行更新   为了向后兼容,请向下滚动以查看原始解决方案。

可以使用正则表达式 - 特别适用于处理存储为字符串的大数字。

const format = num => 
    String(num).replace(/(?<!\..*)(\d)(?=(?:\d{3})+(?:\.|$))/g, '$1,')

;[
    format(100),                           // "100"
    format(1000),                          // "1,000"
    format(1e10),                          // "10,000,000,000"  
    format(1000.001001),                   // "1,000.001001"
    format('100000000000000.001001001001') // "100,000,000,000,000.001001001001
]
    .forEach(n => console.log(n))

» Verbose regex explanation (regex101.com) flow diagram


  

这个原始答案可能不是必需的,但可以用于向后兼容。

尝试使用单个正则表达式(没有回调)来处理这个我的当前能力因为Javascript中没有负面的后视而让我失望...从来没有这里是另一个简洁的替代方案在大多数一般情况下 - 通过忽略匹配的索引出现在句点索引之后的匹配来计算任何小数点。

const format = num => {
    const n = String(num),
          p = n.indexOf('.')
    return n.replace(
        /\d(?=(?:\d{3})+(?:\.|$))/g,
        (m, i) => p < 0 || i < p ? `${m},` : m
    )
}

;[
    format(100),                           // "100"
    format(1000),                          // "1,000"
    format(1e10),                          // "10,000,000,000"  
    format(1000.001001),                   // "1,000.001001"
    format('100000000000000.001001001001') // "100,000,000,000,000.001001001001
]
    .forEach(n => console.log(n))

» Verbose regex explanation (regex101.com)

flow diagram

答案 3 :(得分:9)

有一个不错的jQuery编号插件:https://github.com/teamdf/jquery-number

它允许您以您喜欢的格式更改任何数字,包括十进制数字选项和十进制和千位的分隔符:

$.number(12345.4556, 2);          // -> 12,345.46
$.number(12345.4556, 3, ',', ' ') // -> 12 345,456

您可以直接在输入字段中使用它,这更好,使用与上面相同的选项:

$("input").number(true, 2);

或者您可以使用selector:

应用于整个DOM元素集
$('span.number').number(true, 2);

答案 4 :(得分:4)

// thousand separates a digit-only string using commas
// by element:  onkeyup = "ThousandSeparate(this)"
// by ID:       onkeyup = "ThousandSeparate('txt1','lbl1')"
function ThousandSeparate()
{
    if (arguments.length == 1)
    {
        var V = arguments[0].value;
        V = V.replace(/,/g,'');
        var R = new RegExp('(-?[0-9]+)([0-9]{3})'); 
        while(R.test(V))
        {
            V = V.replace(R, '$1,$2');
        }
        arguments[0].value = V;
    }
    else  if ( arguments.length == 2)
    {
        var V = document.getElementById(arguments[0]).value;
        var R = new RegExp('(-?[0-9]+)([0-9]{3})'); 
        while(R.test(V))
        {
            V = V.replace(R, '$1,$2');
        }
        document.getElementById(arguments[1]).innerHTML = V;
    }
    else return false;
}   

答案 5 :(得分:4)

var number = 35002343;

console.log(number.toLocaleString());

您可以在这里查看参考 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

答案 6 :(得分:3)

我用这个:

int ch = waitKey(); //or waitKey(0)
if (ch == 27)
{
    cap.release();
    destroyAllWindows();
    cout<<"turning off"<<endl;
    break;
}

来源:link

答案 7 :(得分:3)

您可以使用javascript。以下是代码,只有accept数字和一个dot

  

这是javascript

<script >

            function FormatCurrency(ctrl) {
                //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys
                if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {
                    return;
                }

                var val = ctrl.value;

                val = val.replace(/,/g, "")
                ctrl.value = "";
                val += '';
                x = val.split('.');
                x1 = x[0];
                x2 = x.length > 1 ? '.' + x[1] : '';

                var rgx = /(\d+)(\d{3})/;

                while (rgx.test(x1)) {
                    x1 = x1.replace(rgx, '$1' + ',' + '$2');
                }

                ctrl.value = x1 + x2;
            }

            function CheckNumeric() {
                return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;
            }

  </script>
  

HTML

<input type="text" onkeypress="return CheckNumeric()" onkeyup="FormatCurrency(this)" />

DEMO JSFIDDLE

答案 8 :(得分:2)

number = 123456.7089;
result = parseInt( number ).toLocaleString() + "<br>";
result = number.toLocaleString( 'pt-BR' ) + "<br>";

var el = document.getElementById( 'result' );
el.innerHTML = result;
<div id="result"></div>

答案 9 :(得分:1)

PHP.js有一个名为number_format的功能。如果您熟悉PHP,它可以exactly the same way

答案 10 :(得分:1)

您需要做的只是this

using (var con = new MySqlConnection { ConnectionString = "YourConnectionString" })
        {
            con.Open();
            MySqlTransaction trans = con.BeginTransaction();
            MySqlCommand command = con.CreateCommand();
            try
            {
                command.CommandText = @"LOCK TABLES table_1 WRITE, table_2 WRITE;
                                        INSERT INTO table_1 VALUES ('val1', 'val2');
                                        INSERT INTO table_2 VALUES ('val1', 'val2');
                                        UNLOCK TABLES;";
                command.ExecuteNonQuery();
                trans.Commit();
            }
            catch(MySqlException ex)
            {
                trans.Rollback();
                conn.msgErr(ex.Message + " sql query error.");
                conn.msgErr("Neither record was written to database.");
            }
            finally
            {
                command.Dispose();
                trans.Dispose();
            }

        }

答案 11 :(得分:0)

反应溶液的组合

  let converter = Intl.NumberFormat();
  let salary =  monthlySalary.replace(/,/g,'')
  console.log(converter.format(salary))

  this.setState({
    monthlySalary: converter.format(salary)
  })
}

handleOnChangeMonthlySalary(1000)```

答案 12 :(得分:0)

您可以使用ngx-format-field。这是用于格式化将出现在视图中的输入值的指令。它不会操纵将保存在后端的Input值。看到链接here

示例:

component.html:

<input type="text" formControlName="currency" [appFormatFields]="CURRENCY"
(change)="onChangeCurrency()">

component.ts

onChangeCurrency() {
this.currency.patchValue(this.currency.value);
}

观看演示:here

答案 13 :(得分:0)

您可以使用以下功能:

function format(number, decimals = 2, decimalSeparator = '.', thousandsSeparator = ',') {
  const roundedNumber = number.toFixed(decimals);
  let integerPart = '',
    fractionalPart = '';
  if (decimals == 0) {
    integerPart = roundedNumber;
    decimalSeparator = '';
  } else {
    let numberParts = roundedNumber.split('.');
    integerPart = numberParts[0];
    fractionalPart = numberParts[1];
  }
  integerPart = integerPart.replace(/(\d)(?=(\d{3})+(?!\d))/g, `$1${thousandsSeparator}`);
  return `${integerPart}${decimalSeparator}${fractionalPart}`;
}

// Use Example

let min = 1556454.0001;
let max = 15556982.9999;

console.time('number format');
for (let i = 0; i < 15; i++) {
  let randomNumber = Math.random() * (max - min) + min;
  let formated = format(randomNumber, 4, ',', '.'); // formated number

  console.log('number: ', randomNumber, '; formated: ', formated);
}
console.timeEnd('number format');

答案 14 :(得分:-1)

我不喜欢这里的任何答案,所以我创建了一个对我有用的功能。只是想分享以防其他人发现它有用。

function getFormattedCurrency(num) {
    num = num.toFixed(2)
    var cents = (num - Math.floor(num)).toFixed(2);
    return Math.floor(num).toLocaleString() + '.' + cents.split('.')[1];
}