首页 文章

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

提问于
浏览 次
21

我想知道是否可以格式化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

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

我知道像 underscore.string 这样的工具，如 sprintf ，但这似乎是JS应该能够做到的，特别是考虑到模板字符串的强大功能 .

EDIT

如上所述，我已经知道第三方工具（例如sprintf）和自定义功能 . 类似的问题（例如JavaScript equivalent to printf/String.Format）根本没有提到模板字符串，可能是因为在ES6模板字符串出现之前就被问过了 . 我的问题是针对ES6的，并且与实施无关 . 如果是这样的话，我很乐意接受_985555的答案，但是有什么好处的是有关提供此功能的新ES6功能的信息，或者对这种功能是否正在进行中的一些了解 .

javascript string-formatting ecmascript-6 template-strings

6 回答

  • 21

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

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

    回复于
  • 0

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

    var num = 5.1234;
var n = num.toFixed(2);
    回复于
  • -1

    如果你想在这里使用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}`;

    这将格式化浮动并留下字符串 .

    回复于
  • 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'
    回复于
  • 1

    这是一个完全ES6版本的Filip Allberg上面的解决方案，使用ES6“rest”参数 . 唯一缺少的是能够改变精度;这可以通过制作工厂功能来完成 . 留给读者练习 .

    function d2(strs, ...args) {
    var result = strs[0];
    for (var i = 0; i < args.length; ++i) {
        var n = args[i];
        if (Number(n) == n) {
            result += Number(args[i]).toFixed(2);
        } else {
            result += args[i];
        }
        result += strs[i+1];
    }
    return result;
}

f=1.2345678;
s="a string";
console.log(d2`template: ${f} ${f*100} and ${s} (literal:${9.0001})`);
    回复于
  • 0

    您可以使用es6标记函数 . 我不知道准备好使用它 .

    它可能看起来像这样：

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

    学到更多：

    回复于

相关问题