Differenza tra toFixed () e toPrecision ()?

Sono nuovo in JavaScript e ho appena scoperto toFixed()etoPrecision() per arrotondare i numeri. Tuttavia, non riesco a capire quale sia la differenza tra i due.

Qual'è la differenza tra number.toFixed()e number.toPrecision()?

toFixed(n)fornisce la nlunghezza dopo il punto decimale; toPrecision(x)fornisce xla lunghezza totale.

Rif a w3schools: toFixed e toPrecision

EDIT :
Ho imparato qualche tempo fa che w3schools non è esattamente la migliore fonte, ma ho dimenticato questa risposta fino a quando non ho visto il commento "entusiasta" di kzh. Di seguito sono riportati ulteriori riferimenti da Mozilla Doc Center pertoFixed() e pertoPrecision() . Fortunatamente per tutti noi, MDC e w3schools sono d'accordo in questo caso.

Per completezza, dovrei menzionare che toFixed()è equivalente a toFixed(0)e toPrecision()restituisce solo il numero originale senza formattazione.

Credo che il primo ti dia un numero fisso di cifre decimali, mentre il secondo ti dia un numero fisso di cifre significative.

Math.PI.toFixed(2); // "3.14"
Math.PI.toPrecision(2); // "3.1"

Inoltre, toPrecisionprodurrà notazione scientifica se ci sono più cifre intere nel numero rispetto alla precisione specificata.

(Math.PI * 10).toPrecision(2); // "31"
(Math.PI * 100).toPrecision(2); // "3.1e+2"

EDIT: Oh, e se sei nuovo in JavaScript, consiglio vivamente il libro " JavaScript: The Good Parts " di Douglas Crockford.

Gli esempi parlano chiaro:

var A = 123.456789;

A.toFixed()      // 123
A.toFixed(0)     // 123
A.toFixed(1)     // 123.5
A.toFixed(2)     // 123.46
A.toFixed(3)     // 123.457
A.toFixed(4)     // 123.4568
A.toFixed(5)     // 123.45679
A.toFixed(6)     // 123.456789
A.toFixed(7)     // 123.4567890
A.toFixed(8)     // 123.45678900
A.toFixed(9)     // 123.456789000
A.toFixed(10)    // 123.4567890000
A.toFixed(11)    // 123.45678900000

A.toPrecision()      // 123.456789 
A.toPrecision(0)     // --- ERROR --- 
A.toPrecision(1)     // 1e+2
A.toPrecision(2)     // 1.2e+2
A.toPrecision(3)     // 123
A.toPrecision(4)     // 123.5
A.toPrecision(5)     // 123.46
A.toPrecision(6)     // 123.457
A.toPrecision(7)     // 123.4568
A.toPrecision(8)     // 123.45679
A.toPrecision(9)     // 123.456789
A.toPrecision(10)    // 123.4567890
A.toPrecision(11)    // 123.45678900

Penso che sia meglio rispondere con un esempio.

Supponiamo che tu abbia i seguenti dati:

var products = [
  {
    "title": "Really Nice Pen",
    "price": 150
  },
  {
    "title": "Golf Shirt",
    "price": 49.99
  },
  {
    "title": "My Car",
    "price": 1234.56
  }
]

Desideri visualizzare ciascuno di questi prodotti con il titolo e il prezzo formattato. Proviamo toPrecisionprima a usare :

document.write("The price of " + products[0].title + " is $" + products[0].price.toPrecision(5));

The price of Really Nice Pen is $150.00

Sembra buono, quindi potresti pensare che funzionerà anche per gli altri prodotti:

document.write("The price of " + products[1].title + " is $" + products[2].price.toPrecision(5));
document.write("The price of " + products[2].title + " is $" + products[2].price.toPrecision(5));

The price of Golf Shirt is $49.990
The price of My Car is $1234.6

Non così buono. Possiamo risolvere questo problema cambiando il numero di cifre significative per ogni prodotto, ma se stiamo iterando sulla gamma di prodotti che potrebbe essere complicato. Usiamo toFixedinvece:

document.write("The price of " + products[0].title + " is $" + products[0].price.toFixed(2));
document.write("The price of " + products[1].title + " is $" + products[2].price.toFixed(2));
document.write("The price of " + products[2].title + " is $" + products[2].price.toFixed(2));

The price of Really Nice Pen is $150.00
The price of Golf Shirt is $49.99
The price of My Car is $1234.56

Questo produce ciò che ti aspettavi. Non è previsto alcun lavoro di supposizione e non sono previsti arrotondamenti.

Appena:

49.99.toFixed(5)
// → "49.99000"

49.99.toPrecision(5)
// → "49.990"

In determinate circostanze, toPrecision()restituirà la notazione esponenziale, mentre toFixed()no.

Ad esempio, consideriamo la variabile a come, var a = 123.45 a.toPrecision (6) L'output è 123.450 a.toFixed (6) L'output è come 123.450000 // 6 cifre dopo il punto decimale

Entrambi toPrecision()e toFixed()sono funzioni progettate per formattare un numero prima di stamparlo. Quindi tornano entrambiString valori.

C'è un'eccezione. Se si utilizzano queste funzioni su un numero letterale negativo , a causa della precedenza dell'operatore, viene restituito un numero. Ciò significa che toFixed()o toPrecision()restituirà prima una stringa, quindi l' -operatore meno convertirà la stringa in un numero come valore negativo. Vedi sotto per un esempio.

toPrecision()restituisce un simbolo che Stringrappresenta l'oggetto Number in notazione a virgola fissa o esponenziale arrotondato a cifre significative. Quindi, se si specifica che si desidera una precisione di 1, restituisce il primo numero significativo insieme alla notazione scientifica per indicare le potenze di 10 o gli 0 precedenti prima del punto decimale se il numero significativo è <0.

const num1 = 123.4567;

// if no arguments are passed, it is similar to converting the Number to String
num1.toPrecision();   // returns "123.4567

// scientific notation is used when you pass precision count less than total
// number of digits left of the period
num1.toPrecision(2);  // returns "1.2e+2"

// last digit is rounded if precision is less than total significant digits
num1.toPrecision(4);  // returns "123.5"
num1.toPrecision(5);  // returns "123.46"

const largeNum = 456.789;
largeNum.toPrecision(2);  // returns "4.6e+2"

// trailing zeroes are added if precision is > total digits of the number or float
num1.toPrecision(9);  // returns "123.456700"

const num2 = 123;
num2.toPrecision(4);  // returns "123.0"

const num3 = 0.00123;
num3.toPrecision(4);  // returns "0.001230"
num3.toPrecision(5);  // returns "0.0012300"

// if the number is < 1, precision is by the significant digits
num3.toPrecision(1);  // returns "0.001"

toFixed()restituisce un che Stringrappresenta l'oggetto Number in notazione a virgola fissa, arrotondato per eccesso. Questa funzione si occupa solo dei numeri del punto decimale

const num1 = 123.4567;

// if no argument is passed, the fractions are removed
num1.toFixed();  // returns "123"

// specifying an argument means you the amount of numbers after the decimal point
num1.toFixed(1);  // returns "123.5"
num1.toFixed(3);  // returns "123.457"
num1.toFixed(5);  // returns "123.45670"
num1.toFixed(7);  // returns "123.4567000"

// trying to operator on number literals
2.34.toFixed(1);  // returns "2.3"
2.toFixed(1);     // returns SyntaxError
(2).toFixed(1);   // returns "2.0"
(2.34e+5).toFixed(1);  // returns "234000.0"

Ho menzionato sopra un'eccezione in cui l'utilizzo di queste funzioni su valori letterali Number negativi restituirà un numero e non una stringa a causa della precedenza dell'operatore. Ecco alcuni esempi:

// Note: these are returning as Number
// toPrecision()
-123.45.toPrecision();  // returns -123.45
-123.45.toPrecision(2);  // returns -120
-123.45.toPrecision(4);  // returns -123.5
-2.34e+2.toPrecision(1);  // returns -200
-0.0456.toPrecision(1);  // returns -0.05
-0.0456.toPrecision(6);  // returns -0.0456

// toFixed()
-123.45.toFixed();  // returns -123.45
-123.45.toFixed(1);  // returns -123.5
-123.45.toFixed(4);  // returns -123.45
-0.0456.toFixed(1);  // returns -0
-0.0456.toFixed(6);  // -0.0456

Fatto divertente: ci sono zeri con segno come si vede da -0.0456.toFixed(1)

Vedi: +0 e -0 sono uguali?