等效于jquery / javascript中的PHP函数number_format


Answers:


45

这是您想要的吗?

yourFloatVarHere.toFixed(2);

贴吧


23
@MoVod:如何格式化数字1 340.23或1,340.00(注意千位分隔符)?
zergussino,

1
toFixed()在小数点大于5时会四舍五入,但在小数点大于等于5时php中的number_format()会四舍五入。我在验证时遇到问题
-Annapurna,

21
不幸的是,这甚至不能完成PHP的number_format()的一半工作。
BadHorsie

不足。如果您运行,(95**12).toFixed(0)则会得到"5.40360087662637e+23",但如果您在php中运行,number_format(95**12,0)则会得到540,360,087,662,636,990,201,856
hanshenrik '20

93

number_format的JS相同的等效可以发现这里

function number_format (number, decimals, dec_point, thousands_sep) {
    // Strip all characters but numerical ones.
    number = (number + '').replace(/[^0-9+\-Ee.]/g, '');
    var n = !isFinite(+number) ? 0 : +number,
        prec = !isFinite(+decimals) ? 0 : Math.abs(decimals),
        sep = (typeof thousands_sep === 'undefined') ? ',' : thousands_sep,
        dec = (typeof dec_point === 'undefined') ? '.' : dec_point,
        s = '',
        toFixedFix = function (n, prec) {
            var k = Math.pow(10, prec);
            return '' + Math.round(n * k) / k;
        };
    // Fix for IE parseFloat(0.55).toFixed(0) = 0;
    s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.');
    if (s[0].length > 3) {
        s[0] = s[0].replace(/\B(?=(?:\d{3})+(?!\d))/g, sep);
    }
    if ((s[1] || '').length < prec) {
        s[1] = s[1] || '';
        s[1] += new Array(prec - s[1].length + 1).join('0');
    }
    return s.join(dec);
}

13
即使这是很久以前发布的,我仍然认为我要谢谢你-这个出色的答案挽救了我的生命!
Codesee

正确的答案是这个,谢谢。
法哈德

44

只需toLocaleString在整数对象上使用。

https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString#Browser_compatibility

let x = 1234567;
//if x is a string/non-number, use parseInt/parseFloat to convert to a number. Thanks @Aleksandr Kopelevich
x.toLocaleString('us', {minimumFractionDigits: 2, maximumFractionDigits: 2})

12
这应该是正确的答案。不过只有一件事:此函数不适用于字符串。因此,例如,如果您直接从JSON对象获取值,则将parseInt()或parseFloat()应用于此字符串。
Aleksandr Kopelevich

15

本机“国际”对象方法:

var amount = 5000.25;
var locale = 'de';
var options = {style: 'currency', currency: 'eur', minimumFractionDigits: 2, maximumFractionDigits: 2};
var formatter = new Intl.NumberFormat(locale, options);

console.log(formatter.format(amount));

http://jsfiddle.net/arturrelax/sa9jL138/1/

有关更多信息,访问:https : //developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl


2
浏览器兼容性说明:不支持Mobile Safari和IE <11。不建议使用。
猛禽

12

我知道这是一个旧线程,但是我使用纯Javascript编写了自己的函数。

简单的解决方案

https://gist.github.com/VassilisPallas/d73632e9de4794b7dd10b7408f7948e8/bf17eccef8521b4e5869bdc6a5b09a771356fbff

这对有限数有效

function number_format(number, decimals, dec_point, thousands_point) {

    if (number == null || !isFinite(number)) {
        throw new TypeError("number is not valid");
    }

    if (!decimals) {
        var len = number.toString().split('.').length;
        decimals = len > 1 ? len : 0;
    }

    if (!dec_point) {
        dec_point = '.';
    }

    if (!thousands_point) {
        thousands_point = ',';
    }

    number = parseFloat(number).toFixed(decimals);

    number = number.replace(".", dec_point);

    var splitNum = number.split(dec_point);
    splitNum[0] = splitNum[0].replace(/\B(?=(\d{3})+(?!\d))/g, thousands_point);
    number = splitNum.join(dec_point);

    return number;
}

复杂的解决方案

这解决了数量众多的问题

https://gist.github.com/VassilisPallas/d73632e9de4794b7dd10b7408f7948e8

 const splitThousands = (number) => (dec_point, thousands_point) => {
  const splitNum = number.toString().split(dec_point);
  splitNum[0] = splitNum[0].replace(/\B(?=(\d{3})+(?!\d))/g, thousands_point);
  return splitNum.join(dec_point);
};

const isBigNumber = (number) => number.toString().includes("e");

const isBigFloat = (number) => number.toString().includes("-");

const calcTrailing = (dec, len) => Number(dec) + 2 - len;

const handleBigFloats = (number, decimals) => {
  if (!decimals) {
    return "0";
  }

  const [numbers, dec] = number.toString().replace(".", "").split("e-");
  const trailingZeros = calcTrailing(dec, numbers.length);
  const res = `${"0.".padEnd(trailingZeros + 2, "0")}${numbers}`;

  return decimals ? res.substring(0, 2) + res.substring(2, decimals + 2) : res;
};

const handleBigNumbers = (number, decimals, dec_point, thousands_point) => {
  if (isBigFloat(number)) {
    return handleBigFloats(number, decimals);
  }

  return splitThousands(BigInt(number))(dec_point, thousands_point);
};

function handleFiniteNumbers(number, decimals, dec_point, thousands_point) {
  if (!isFinite(number)) {
    throw new TypeError("number is not finite number");
  }

  if (!decimals) {
    const len = number.toString().split(".").length;
    decimals = len > 1 ? len : 0;
  }

  return splitThousands(
    parseFloat(number).toFixed(decimals).replace(".", dec_point)
  )(dec_point, thousands_point);
}

const numberFormat = (
  number,
  decimals,
  dec_point = ".",
  thousands_point = ","
) => {
  if (number == null || typeof number !== "number") {
    throw new TypeError("number is not valid");
  }

  if (isBigNumber(number)) {
    return handleBigNumbers(number, decimals, dec_point, thousands_point);
  }

  return handleFiniteNumbers(number, decimals, dec_point, thousands_point);
};

https://jsfiddle.net/p2ft9n4v/1/


1
发现了一个错误:如果您number_format(95**12,0)在函数中运行,则会得到"5.40360087662637e+23",但如果您在php中运行,则会得到"540,360,087,662,636,990,201,856"
hanshenrik

10

接近PHP的功能number_format($number)应该是number.toLocaleString('en')JavaScript


2
这是一个很好的建议。为了更进一步,我将添加parseInt():parseInt(data).toLocaleString('en');
凤凰城

4

这是另一个简短的解决方案,其行为应类似于php等效。

function number_format(number,decimals,dec_point,thousands_sep) {
    number  = number*1;//makes sure `number` is numeric value
    var str = number.toFixed(decimals?decimals:0).toString().split('.');
    var parts = [];
    for ( var i=str[0].length; i>0; i-=3 ) {
        parts.unshift(str[0].substring(Math.max(0,i-3),i));
    }
    str[0] = parts.join(thousands_sep?thousands_sep:',');
    return str.join(dec_point?dec_point:'.');
}

2
喜欢这种短功能。但是,我们必须number通过number = number*1;在函数的第一行添加数字来强制使用数字/整数。因为有时浏览器将其识别为字符串,然后toFixed无法识别函数(未定义的函数number.toFixed())
Oki Erie Rinaldi

3

这是一个简单的函数,可用于在php中获得几乎相同的number_format结果:

function number_format(user_input){
    var filtered_number = user_input.replace(/[^0-9]/gi, '');
    var length = filtered_number.length;
    var breakpoint = 1;
    var formated_number = '';

    for(i = 1; i <= length; i++){
        if(breakpoint > 3){
            breakpoint = 1;
            formated_number = ',' + formated_number;
        }
        var next_letter = i + 1;
        formated_number = filtered_number.substring(length - i, length - (i - 1)) + formated_number; 

        breakpoint++;
    }

    return formated_number;
}

另一种方法是使用ajax调用php脚本,在该脚本上,您可以对数字运行number_format并以ajax作为字符串返回它。但这有点混乱。



0

我对此:

var number_format = function(num) {
  stringNum = num.toString();
  stringNum = stringNum.split("");
  c = 0;
  if (stringNum.length>3) {
    for (i=stringNum.length; i>-1; i--) {
      if ( (c==3) && ((stringNum.length-i)!=stringNum.length) ) {
        stringNum.splice(i, 0, ",");
        c=0;
      }
      c++
    }
    return stringNum;
  }
  return num;
}

$("body").append(number_format(100000000));

0

暴露示例的另一个变体:

const numberFormat = (value, decimals, decPoint, thousandsSep) => {
    decPoint = decPoint || '.';
    decimals = decimals !== undefined ? decimals : 2;
    thousandsSep = thousandsSep || ' ';

    if (typeof value === 'string') {
        value = parseFloat(value);
    }

    let result = value.toLocaleString('en-US', {
        maximumFractionDigits: decimals,
        minimumFractionDigits: decimals
    });

    let pieces = result.split('.');
    pieces[0] = pieces[0].split(',').join(thousandsSep);

    return pieces.join(decPoint);
};

-2

我要做的只是按如下方式调用JS函数,它可以正常工作:

var formattedNumber = number_format(value)
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.