javascript - C# と同様に JavaScript で数値をフォーマットする

Question

または を介し​​て C# (または VB.NET) で使用できるフォーマット方法と同様に、JavaScript で数値をフォーマットする簡単な方法はありますToString("format_provider")かString.Format()?

Answer 1

一般的

• JavaScript で数値をフォーマットする
• 通貨表示などの数値の書式設定。

jQueryで

• autoNumeric (jQuery 1.5+ のロケールをサポートする適切な数値フォーマッターと入力ヘルパー)
• jQuery Format (Java のSimpleDateFormatおよびNumberFormatの clientSide 実装)
• jquery-numberformatter (ロケールをサポートする数値フォーマッター)

Answer 2

はい、JavaScript で数値を適切にフォーマットする方法は間違いなくあります。たとえば、次のようになります。

var val=2489.8237

val.toFixed(3) //returns 2489.824 (round up)
val.toFixed(2) //returns 2489.82
val.toFixed(7) //returns 2489.8237000 (padding)

変数名を使用します。に固定。

そしてもう一つ機能がありますtoPrecision()。詳細については、こちらもご覧ください

http://raovishal.blogspot.com/2012/01/number-format-in-javascript.html

Answer 3

文字列形式の整数にコンマを追加する単純な JS 関数を次に示します。整数または小数を処理します。数値または文字列を渡すことができます。明らかに文字列を返します。

function addCommas(str) {
    var parts = (str + "").split("."),
        main = parts[0],
        len = main.length,
        output = "",
        first = main.charAt(0),
        i;

    if (first === '-') {
        main = main.slice(1);
        len = main.length;    
    } else {
        first = "";
    }
    i = len - 1;
    while(i >= 0) {
        output = main.charAt(i) + output;
        if ((len - i) % 3 === 0 && i > 0) {
            output = "," + output;
        }
        --i;
    }
    // put sign back
    output = first + output;
    // put decimal part back
    if (parts.length > 1) {
        output += "." + parts[1];
    }
    return output;
}

テストケースのセットは次のとおりです：http://jsfiddle.net/jfriend00/6y57j/

この以前の jsFiddle で使用されていることがわかります: http://jsfiddle.net/jfriend00/sMnjT/。Google で「javascript add commas」を検索するだけで、10 進数を処理する関数を見つけることができます。

数値を文字列に変換するには、さまざまな方法があります。最も簡単なのは、文字列に追加することです。

var myNumber = 3;
var myStr = "" + myNumber;   // "3"

jsFiddle のコンテキスト内で、次の行を変更することでカウンターにコンマを挿入できます。

jTarget.text(current);

これに：

jTarget.text(addCommas(current));

ここで動作することがわかります: http://jsfiddle.net/jfriend00/CbjSX/

Answer 4

数字が最初から数字ではない場合、数字を10進数で区切られた文字列または空の文字列に変換する単純な関数を作成しました（まだ別のjQueryプラグインは必要ありません!!）：

function format(x) {
    return isNaN(x)?"":x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

format(578999);結果は578,999

format(10);結果は10

コンマの代わりに小数点が必要な場合は、コード内のコンマを小数点に置き換えるだけです。

コメントの1つは、これは整数に対してのみ機能すると正しく述べていますが、いくつかの小さな適応により、浮動小数点でも機能するようにすることができます:

function format(x) {
    if(isNaN(x))return "";

    n= x.toString().split('.');
    return n[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",")+(n.length>1?"."+n[1]:"");
}

Answer 5

ここにいくつかのソリューションがあります。すべてテスト スイート、テスト スイート、およびベンチマークに合格しています。コピーして貼り付けてテストする場合は、This Gistを試してください。

方法 0 (正規表現)

https://stackoverflow.com/a/14428340/1877620に基づいていますが、小数点がない場合は修正してください。

if (typeof Number.prototype.format === 'undefined') {
    Number.prototype.format = function (precision) {
        if (!isFinite(this)) {
            return this.toString();
        }

        var a = this.toFixed(precision).split('.');
        a[0] = a[0].replace(/\d(?=(\d{3})+$)/g, '$&,');
        return a.join('.');
    }
}

方法 1

if (typeof Number.prototype.format1 === 'undefined') {
    Number.prototype.format1 = function (precision) {
        if (!isFinite(this)) {
            return this.toString();
        }

        var a = this.toFixed(precision).split('.'),
            // skip the '-' sign
            head = Number(this < 0);

        // skip the digits that's before the first thousands separator 
        head += (a[0].length - head) % 3 || 3;

        a[0] = a[0].slice(0, head) + a[0].slice(head).replace(/\d{3}/g, ',$&');
        return a.join('.');
    };
}

方法 2 (配列に分割)

if (typeof Number.prototype.format2 === 'undefined') {
    Number.prototype.format2 = function (precision) {
        if (!isFinite(this)) {
            return this.toString();
        }

        var a = this.toFixed(precision).split('.');

        a[0] = a[0]
            .split('').reverse().join('')
            .replace(/\d{3}(?=\d)/g, '$&,')
            .split('').reverse().join('');

        return a.join('.');
    };
}

方法 3 (ループ)

if (typeof Number.prototype.format3 === 'undefined') {
    Number.prototype.format3 = function (precision) {
        if (!isFinite(this)) {
            return this.toString();
        }

        var a = this.toFixed(precision).split('');
        a.push('.');

        var i = a.indexOf('.') - 3;
        while (i > 0 && a[i-1] !== '-') {
            a.splice(i, 0, ',');
            i -= 3;
        }

        a.pop();
        return a.join('');
    };
}

例

console.log('======== Demo ========')
var n = 0;
for (var i=1; i<20; i++) {
    n = (n * 10) + (i % 10)/100;
    console.log(n.format(2), (-n).format(2));
}

セパレーター

カスタムの桁区切り記号または小数点区切り記号が必要な場合は、replace() を使用します。

123456.78.format(2).replace(',', ' ').replace('.', ' ');

テスト スイート

function assertEqual(a, b) {
    if (a !== b) {
        throw a + ' !== ' + b;
    }
}

function test(format_function) {
    console.log(format_function);
    assertEqual('NaN', format_function.call(NaN, 0))
    assertEqual('Infinity', format_function.call(Infinity, 0))
    assertEqual('-Infinity', format_function.call(-Infinity, 0))

    assertEqual('0', format_function.call(0, 0))
    assertEqual('0.00', format_function.call(0, 2))
    assertEqual('1', format_function.call(1, 0))
    assertEqual('-1', format_function.call(-1, 0))
    // decimal padding
    assertEqual('1.00', format_function.call(1, 2))
    assertEqual('-1.00', format_function.call(-1, 2))
    // decimal rounding
    assertEqual('0.12', format_function.call(0.123456, 2))
    assertEqual('0.1235', format_function.call(0.123456, 4))
    assertEqual('-0.12', format_function.call(-0.123456, 2))
    assertEqual('-0.1235', format_function.call(-0.123456, 4))
    // thousands separator
    assertEqual('1,234', format_function.call(1234.123456, 0))
    assertEqual('12,345', format_function.call(12345.123456, 0))
    assertEqual('123,456', format_function.call(123456.123456, 0))
    assertEqual('1,234,567', format_function.call(1234567.123456, 0))
    assertEqual('12,345,678', format_function.call(12345678.123456, 0))
    assertEqual('123,456,789', format_function.call(123456789.123456, 0))
    assertEqual('-1,234', format_function.call(-1234.123456, 0))
    assertEqual('-12,345', format_function.call(-12345.123456, 0))
    assertEqual('-123,456', format_function.call(-123456.123456, 0))
    assertEqual('-1,234,567', format_function.call(-1234567.123456, 0))
    assertEqual('-12,345,678', format_function.call(-12345678.123456, 0))
    assertEqual('-123,456,789', format_function.call(-123456789.123456, 0))
    // thousands separator and decimal
    assertEqual('1,234.12', format_function.call(1234.123456, 2))
    assertEqual('12,345.12', format_function.call(12345.123456, 2))
    assertEqual('123,456.12', format_function.call(123456.123456, 2))
    assertEqual('1,234,567.12', format_function.call(1234567.123456, 2))
    assertEqual('12,345,678.12', format_function.call(12345678.123456, 2))
    assertEqual('123,456,789.12', format_function.call(123456789.123456, 2))
    assertEqual('-1,234.12', format_function.call(-1234.123456, 2))
    assertEqual('-12,345.12', format_function.call(-12345.123456, 2))
    assertEqual('-123,456.12', format_function.call(-123456.123456, 2))
    assertEqual('-1,234,567.12', format_function.call(-1234567.123456, 2))
    assertEqual('-12,345,678.12', format_function.call(-12345678.123456, 2))
    assertEqual('-123,456,789.12', format_function.call(-123456789.123456, 2))
}

console.log('======== Testing ========');
test(Number.prototype.format);
test(Number.prototype.format1);
test(Number.prototype.format2);
test(Number.prototype.format3);

基準

function benchmark(f) {
    var start = new Date().getTime();
    f();
    return new Date().getTime() - start;
}

function benchmark_format(f) {
    console.log(f);
    time = benchmark(function () {
        for (var i = 0; i < 100000; i++) {
            f.call(123456789, 0);
            f.call(123456789, 2);
        }
    });
    console.log(time.format(0) + 'ms');
}

async = [];
function next() {
    setTimeout(function () {
        f = async.shift();
        f && f();
        next();
    }, 10);
}

console.log('======== Benchmark ========');
async.push(function () { benchmark_format(Number.prototype.format); });
async.push(function () { benchmark_format(Number.prototype.format1); });
async.push(function () { benchmark_format(Number.prototype.format2); });
async.push(function () { benchmark_format(Number.prototype.format3); });
next();

Answer 6

jQuery を使用したくない場合は、Numeral.jsをご覧ください。

Answer 7

まず、JS で整数を文字列に変換するのは非常に簡単です。

// Start off with a number
var number = 42;
// Convert into a string by appending an empty (or whatever you like as a string) to it
var string = 42+'';
// No extra conversion is needed, even though you could actually do
var alsoString = number.toString();

数値を文字列として持っていて、それを整数に変換したい場合はparseInt(string)、整数とparseFloat(string)浮動小数点数に を使用する必要があります。これらの関数は両方とも、目的の整数/浮動小数点数を返します。例：

// Start off with a float as a string
var stringFloat = '3.14';
// And an int as a string
var stringInt = '42';

// typeof stringInt  would give you 'string'

// Get the real float from the string
var realFloat = parseFloat(someFloat);
// Same for the int
var realInt = parseInt(stringInt);

// but typeof realInt  will now give you 'number'

正確に何を追加しようとしているのかなど、あなたの質問からは不明のままです。

Answer 8

http://code.google.com/p/javascript-number-formatter/ :

• 短く、高速で、柔軟でありながらスタンドアロンです。MIT ライセンス情報、空白行、コメントを含めてわずか 75 行です。
• #,##0.00 または否定 -000.#### のような標準の数値形式を受け入れます。
• # ##0,00、#、###.##、#####.## などの国の形式、または任意の種類の非番号記号を受け入れます。
• 任意の数字のグループ化を受け入れます。#,##,#0.000 または #,###0.## はすべて有効です。
• 冗長/簡単なフォーマットを受け入れます。##,###,##.# または 0#,#00#.###0# はすべて OK です。
• 自動数値丸め。
• シンプルなインターフェース。次のようにマスクと値を指定するだけです: format( "0.0000", 3.141592)

アップデート

ここでTomášZatoが言うように、 1行のソリューション：

(666.0).toLocaleString()
numObj.toLocaleString([locales [, options]])

ECMA-262 5.1 Edition で説明されているもの:

• http://www.ecma-international.org/ecma-262/5.1/#sec-15.7.4.3
• https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString

ブラウザの将来のバージョンで動作します...

Answer 9

例えば：

var flt = '5.99';
var nt = '6';

var rflt = parseFloat(flt);
var rnt = parseInt(nt);

Answer 10

コンマの後に 2 つの数字を含む 10 進数を取得するには、次のようにします。

function nformat(a) {
   var b = parseInt(parseFloat(a)*100)/100;
   return b.toFixed(2);
}

Answer 11

JQueryの使用。

$(document).ready(function()
 {
    //Only number and one dot
    function onlyDecimal(element, decimals)
    {
        $(element).keypress(function(event)
        {
            num = $(this).val() ;
            num = isNaN(num) || num === '' || num === null ? 0.00 : num ;
            if ((event.which != 46 || $(this).val().indexOf('.') != -1) && (event.which < 48 || event.which > 57))
            {
                event.preventDefault();

            }
            if($(this).val() == parseFloat(num).toFixed(decimals))
            {
                event.preventDefault();
            }
        });
    }

     onlyDecimal("#TextBox1", 3) ;



});

Answer 12

計算ではなく表示用に数値をフォーマットする場合は、これを使用できます

function numberFormat( number ){

    var digitCount = (number+"").length;
    var formatedNumber = number+"";
    var ind = digitCount%3 || 3;
    var temparr = formatedNumber.split('');

    if( digitCount > 3 && digitCount <= 6 ){

        temparr.splice(ind,0,',');
        formatedNumber = temparr.join('');

    }else if (digitCount >= 7 && digitCount <= 15) {
        var temparr2 = temparr.slice(0, ind);
        temparr2.push(',');
        temparr2.push(temparr[ind]);
        temparr2.push(temparr[ind + 1]);
        // temparr2.push( temparr[ind + 2] ); 
        if (digitCount >= 7 && digitCount <= 9) {
            temparr2.push(" million");
        } else if (digitCount >= 10 && digitCount <= 12) {
            temparr2.push(" billion");
        } else if (digitCount >= 13 && digitCount <= 15) {
            temparr2.push(" trillion");

        }
        formatedNumber = temparr2.join('');
    }
    return formatedNumber;
}

入力: {整数} 数値

出力: {String} 数値

22,870 => 数が 22870 の場合

2287 万 => 2287xxxx の場合 (x は何でも構いません)

22,870 億 => 2287xxxxxxx の場合

22,87 兆 => 2287xxxxxxxxxx の場合

あなたはアイデアを得る