Question

我想知道是否可以格式化Javascript模板字符串中的数字，例如：

var n = 5.1234;
console.log(`This is a number: $.2d{n}`);
// -> 5.12

或者可能

var n = 5.1234;
console.log(`This is a number: ${n.toString('.2d')}`);
// -> 5.12

这种语法显然不起作用，它只是我正在寻找的东西的一个例子。

我知道来自sprintf的{{1}}工具，但这似乎是JS应该能够开箱即用的，特别是考虑到模板字符串的强大功能。

编辑

如上所述，我已经了解第三方工具（例如sprintf）和自定义功能。类似的问题（例如JavaScript equivalent to printf/String.Format）根本没有提到模板字符串，可能是因为在ES6模板字符串出现之前就被问过了。我的问题是针对ES6的，并且与实施无关。我很高兴接受一个答案“不，这是不可能的”，如果是这样的话，但是最好的是关于提供此功能的新ES6功能的信息，或者是否有关于此功能是否在其上的一些信息方式。

Answer 1

不，ES6不会引入任何新的数字格式化功能，您必须使用现有的.toExponential(fractionDigits)，.toFixed(fractionDigits)，.toPrecision(precision)，.toString([radix])和{{3 （已更新，可选择支持toLocaleString(…)）模板字符串与数字格式无关，它们只是去函数调用（如果标记）或字符串连接（默认）。

如果这些Number方法对您来说还不够，那么您必须自己动手。当然，如果您愿意，可以将格式化函数编写为模板字符串标记。

Answer 2

您应该能够使用数字的toFixed（）方法：

var num = 5.1234;
var n = num.toFixed(2);

Answer 3

如果您想使用ES6标记函数，则此标记函数的外观如下，

function d2(pieces) {
    var result = pieces[0];
    var substitutions = [].slice.call(arguments, 1);

    for (var i = 0; i < substitutions.length; ++i) {
        var n = substitutions[i];

        if (Number(n) == n) {
            result += Number(substitutions[i]).toFixed(2);
        } else {
            result += substitutions[i];
        }

        result += pieces[i + 1];
    }

    return result;
}

然后可以将其应用于模板字符串，

d2`${some_float} (you can interpolate as many floats as you want) of ${some_string}`;

将格式化浮点数，并保留字符串。

Answer 4

这是上述Filip Allberg解决方案的完整ES6版本，使用了ES6“剩余”参数。唯一缺少的是能够改变精度。可以通过启用工厂功能来完成。留给读者练习。

CFIT("address")

Answer 5

虽然无法使用模板字符串插值进行格式化，但您可以使用Intl.NumberFormat获得等效的行为：

const format = (num, fraction = 2) => new Intl.NumberFormat([], {
  minimumFractionDigits: fraction,
  maximumFractionDigits: fraction,
}).format(num);

format(5.1234); // -> '5.12'

请注意，无论您选择哪种实现方式，都可能由于四舍五入而被咬住：

(9.999).toFixed(2) // -> '10.00'

new Intl.NumberFormat([], {
  minimumFractionDigits: 2,
  maximumFractionDigits: 2, // <- implicit rounding!
}).format(9.999) // -> '10.00'

Answer 6

您可以使用es6标记功能。我不知道准备好使用它了。

可能看起来像这样：

num`This is a number: $.2d{n}`

了解详情：

模板字符串中的数字格式（Javascript - ES6）

6 个答案: