javascript - strings - template string typescript

Formato de números en cadenas de plantillas(Javascript-ES6)

Question

Me preguntaba si es posible formatear números en cadenas de plantilla de Javascript, por ejemplo, algo como:

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

O posiblemente

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

Esa sintaxis obviamente no funciona, es solo una ilustración del tipo de cosas que estoy buscando.

Estoy al tanto de herramientas como sprintf de underscore.string , pero esto parece algo que JS debería poder resolver, especialmente dado el poder de las cadenas de plantilla.

EDITAR

Como se indicó anteriormente, ya conozco herramientas de terceros (por ejemplo, sprintf) y funciones personalizadas para hacer esto. Las preguntas similares (p. Ej., El equivalente en JavaScript de printf / String.Format ) no mencionan las cadenas de la plantilla, probablemente porque se hicieron antes de que existieran las cadenas de la plantilla ES6. Mi pregunta es específica para ES6 y es independiente de la implementación. Estoy encantado de aceptar una respuesta de "No, esto no es posible" si ese es el caso, pero lo que sería genial es la información sobre una nueva característica de ES6 que proporciona esto, o alguna información sobre si dicha característica está en su lista. camino.

Answer 1

Aquí hay una versión completamente ES6 de la solución de Filip Allberg anterior, utilizando los parámetros de "resto" de ES6. Lo único que falta es poder variar la precisión; Eso podría hacerse haciendo una función de fábrica. Se deja como ejercicio para el lector.

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})`);

Answer 2

Debería poder usar el método toFixed () de un número:

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

Answer 3

No, ES6 no introduce nuevas funciones de formato numérico, tendrá que vivir con el existente .toExponential(fractionDigits) , .toFixed(fractionDigits) , .toPrecision(precision) , .toString([radix]) y toLocaleString(…) (aunque se ha actualizado para admitir opcionalmente el estándar ECMA-402 ).
Las cadenas de la plantilla no tienen nada que ver con el formato de los números, simplemente desaparecen en una llamada de función (si está etiquetada) o concatenación de cadenas (predeterminada).

Si esos métodos de Number no son suficientes para ti, tendrás que sacar los tuyos. Por supuesto, puede escribir su función de formato como una etiqueta de cadena de plantilla si desea hacerlo.

Answer 4

Puede utilizar las funciones de etiqueta es6. No sé listo para el uso de eso.

Podría verse así:

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

Aprende más:

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals
• https://developers.google.com/web/updates/2015/01/ES6-Template-Strings

Answer 5

Si bien el formateo mediante la interpolación de cadenas de plantillas no está disponible como una función incorporada, puede obtener un comportamiento equivalente con Intl.NumberFormat :

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

Tenga en cuenta que, independientemente de la implementación que elija, puede recibir errores de redondeo:

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

Answer 6

Si desea utilizar las funciones de etiqueta ES6, aquí se muestra cómo se vería esa función de etiqueta.

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;
}

que luego se puede aplicar a una cadena de plantilla por lo tanto,

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

que formateará el flotador y dejará la cadena sola.