Zahlen mit signifikanten Stellen formatieren

Steuern Sie, welche Ziffern angezeigt und gerundet werden, indem Sie die Genauigkeit festlegen

Einführung

Bei der Formatierung von Zahlen zur Anzeige müssen Sie manchmal die Genauigkeit basierend darauf steuern, wie viele aussagekräftige Ziffern eine Zahl enthält, anstatt wie viele Ziffern nach dem Dezimaltrennzeichen erscheinen. Dieser Ansatz wird als Formatierung mit signifikanten Stellen bezeichnet.

Signifikante Stellen repräsentieren die Ziffern in einer Zahl, die aussagekräftige Informationen über ihre Genauigkeit enthalten. Die Zahl 123,45 hat fünf signifikante Stellen. Die Zahl 0,00123 hat drei signifikante Stellen, da die führenden Nullen nur die Größenordnung angeben, nicht die Genauigkeit.

Diese Lektion zeigt Ihnen, wie Sie Zahlen mit signifikanten Stellen in JavaScript formatieren. Sie lernen, wann dieser Ansatz besser ist als die Steuerung von Dezimalstellen und wie Sie die Optionen minimumSignificantDigits und maximumSignificantDigits mit der Intl.NumberFormat-API verwenden.

Was sind signifikante Stellen

Signifikante Stellen sind die Ziffern in einer Zahl, die ihre Genauigkeit angeben. Um zu verstehen, welche Ziffern signifikant sind, müssen bestimmte Regeln befolgt werden.

Alle Ziffern ungleich null sind immer signifikant. In der Zahl 123 sind alle drei Ziffern signifikant. In 45,67 sind alle vier Ziffern signifikant.

Führende Nullen sind niemals signifikant. Sie geben nur die Position des Dezimaltrennzeichens an. In 0,0045 sind nur die 4 und 5 signifikante Stellen. Die Zahl hat zwei signifikante Stellen, nicht sechs.

Nachfolgende Nullen nach dem Dezimaltrennzeichen sind signifikant. Sie zeigen an, dass die Messung oder Berechnung auf diesem Niveau präzise war. Die Zahl 1,200 hat vier signifikante Stellen, während 1,2 nur zwei hat.

Nachgestellte Nullen vor dem Dezimaltrennzeichen hängen vom Kontext ab. Bei der Zahl 1200 ist ohne zusätzliche Informationen unklar, ob die Nullen signifikant sind. Wissenschaftliche Notation oder explizite Präzisionsindikatoren lösen diese Mehrdeutigkeit auf.

Zahlen mit maximalen signifikanten Stellen formatieren

Die Option maximumSignificantDigits begrenzt, wie viele signifikante Stellen in der formatierten Ausgabe erscheinen. Diese Option ist nützlich, wenn Sie Zahlen mit konsistenter Präzision unabhängig von ihrer Größenordnung anzeigen möchten.

const formatter = new Intl.NumberFormat("en-US", {
  maximumSignificantDigits: 3,
});

console.log(formatter.format(1.2345));
// Output: "1.23"

console.log(formatter.format(12.345));
// Output: "12.3"

console.log(formatter.format(123.45));
// Output: "123"

console.log(formatter.format(1234.5));
// Output: "1,230"

Wenn die Zahl mehr signifikante Stellen als das Maximum enthält, rundet der Formatierer die Zahl. Die Rundung folgt den Standardrundungsregeln und rundet auf den nächstgelegenen Wert. Wenn eine Zahl genau in der Mitte zwischen zwei Werten liegt, wird auf die nächste gerade Zahl gerundet.

Die Option maximumSignificantDigits akzeptiert Werte von 1 bis 21. Der Standardwert, wenn diese Option nicht angegeben ist, beträgt 21, was effektiv keine Begrenzung bedeutet.

const oneDigit = new Intl.NumberFormat("en-US", {
  maximumSignificantDigits: 1,
});

console.log(oneDigit.format(54.33));
// Output: "50"

console.log(oneDigit.format(56.33));
// Output: "60"

Diese Option funktioniert mit allen Zahlentypen, einschließlich Ganzzahlen, Dezimalzahlen und Zahlen in verschiedenen Notationen.

Zahlen mit minimalen signifikanten Stellen formatieren

Die Option minimumSignificantDigits stellt sicher, dass mindestens die angegebene Anzahl signifikanter Stellen in der formatierten Ausgabe erscheint. Wenn die Zahl weniger signifikante Stellen als das Minimum enthält, fügt der Formatierer nachgestellte Nullen hinzu.

const formatter = new Intl.NumberFormat("en-US", {
  minimumSignificantDigits: 5,
});

console.log(formatter.format(1.23));
// Output: "1.2300"

console.log(formatter.format(123));
// Output: "123.00"

console.log(formatter.format(0.0012));
// Output: "0.0012000"

Diese Option ist nützlich, wenn Sie Zahlen mit einem konsistenten Präzisionsniveau anzeigen müssen und zeigen möchten, dass Messungen oder Berechnungen mit einer bestimmten Genauigkeit durchgeführt wurden.

Die Option minimumSignificantDigits akzeptiert Werte von 1 bis 21. Der Standardwert beträgt 1, was bedeutet, dass Zahlen ihre natürliche Präzision ohne hinzugefügte Nullen anzeigen.

const manyDigits = new Intl.NumberFormat("en-US", {
  minimumSignificantDigits: 10,
});

console.log(manyDigits.format(5));
// Output: "5.000000000"

Der Formatierer fügt Nullen nach dem Dezimaltrennzeichen hinzu, um das Minimum zu erreichen, oder fügt bei Bedarf Nullen vor dem Dezimaltrennzeichen hinzu.

Kombination von minimalen und maximalen signifikanten Stellen

Sie können sowohl minimumSignificantDigits als auch maximumSignificantDigits zusammen angeben, um einen Bereich akzeptabler Präzision zu erstellen. Der Formatierer zeigt Zahlen innerhalb dieses Bereichs an.

const formatter = new Intl.NumberFormat("en-US", {
  minimumSignificantDigits: 3,
  maximumSignificantDigits: 5,
});

console.log(formatter.format(1.2));
// Output: "1.20"
// Expanded to meet minimum of 3

console.log(formatter.format(1.234));
// Output: "1.234"
// Within range, displayed as-is

console.log(formatter.format(1.23456789));
// Output: "1.2346"
// Rounded to meet maximum of 5

Bei der Kombination dieser Optionen muss das Minimum kleiner oder gleich dem Maximum sein. Wenn Sie ein Minimum angeben, das größer als das Maximum ist, löst der Formatierer einen RangeError aus.

try {
  const invalid = new Intl.NumberFormat("en-US", {
    minimumSignificantDigits: 5,
    maximumSignificantDigits: 3,
  });
} catch (error) {
  console.log(error.name);
  // Output: "RangeError"
}

Diese Kombination ist besonders nützlich für wissenschaftliche oder finanzielle Anwendungen, bei denen Sie sowohl ein Mindestmaß an Präzision durchsetzen als auch verhindern möchten, dass übermäßig viele Ziffern die Anzeige überladen.

Wie sich signifikante Stellen von Dezimalstellen unterscheiden

Signifikante Stellen und Dezimalstellen stellen zwei unterschiedliche Ansätze zur Steuerung der Zahlenpräzision dar. Das Verständnis, wann welcher Ansatz zu verwenden ist, hilft Ihnen, Zahlen angemessen zu formatieren.

Dezimalstellen steuern, wie viele Ziffern nach dem Dezimaltrennzeichen erscheinen, unabhängig von der Größenordnung der Zahl. Die Optionen minimumFractionDigits und maximumFractionDigits implementieren diesen Ansatz.

const decimalPlaces = new Intl.NumberFormat("en-US", {
  minimumFractionDigits: 2,
  maximumFractionDigits: 2,
});

console.log(decimalPlaces.format(1.2));
// Output: "1.20"

console.log(decimalPlaces.format(12.3));
// Output: "12.30"

console.log(decimalPlaces.format(123.4));
// Output: "123.40"

Signifikante Stellen steuern, wie viele aussagekräftige Ziffern in der gesamten Zahl erscheinen, und passen sich der Größenordnung der Zahl an. Zahlen mit unterschiedlichen Größenordnungen zeigen unterschiedliche Anzahlen von Dezimalstellen an, um eine konsistente Präzision beizubehalten.

const significantDigits = new Intl.NumberFormat("en-US", {
  minimumSignificantDigits: 3,
  maximumSignificantDigits: 3,
});

console.log(significantDigits.format(1.2));
// Output: "1.20"

console.log(significantDigits.format(12.3));
// Output: "12.3"

console.log(significantDigits.format(123.4));
// Output: "123"

Beachten Sie, wie der Ansatz mit signifikanten Stellen weniger Dezimalstellen anzeigt, wenn die Größenordnung der Zahl zunimmt, während der Ansatz mit Dezimalstellen unabhängig von der Größenordnung die gleiche Anzahl von Dezimalstellen anzeigt.

Interaktion mit Optionen für Nachkommastellen

Wenn Sie Optionen für signifikante Stellen angeben, haben diese standardmäßig Vorrang vor Optionen für Nachkommastellen. Der Formatter ignoriert minimumFractionDigits und maximumFractionDigits, wenn eine der Optionen für signifikante Stellen vorhanden ist.

const formatter = new Intl.NumberFormat("en-US", {
  minimumFractionDigits: 2,
  maximumFractionDigits: 2,
  maximumSignificantDigits: 3,
});

console.log(formatter.format(1234.56));
// Output: "1,230"
// Significant digits option takes precedence
// Fraction digit options are ignored

Dieses Verhalten wird durch die Option roundingPriority gesteuert, die bestimmt, wie der Formatter Konflikte zwischen verschiedenen Präzisionseinstellungen auflöst. Der Standardwert ist "auto", der signifikanten Stellen Vorrang gibt.

Sie können dieses Verhalten ändern, indem Sie roundingPriority auf "morePrecision" oder "lessPrecision" setzen, aber dies sind erweiterte Optionen für spezialisierte Anwendungsfälle. Für die meisten Anwendungen ist das standardmäßige Vorrangverhalten angemessen.

Wann signifikante Stellen anstelle von Dezimalstellen verwendet werden sollten

Wählen Sie signifikante Stellen, wenn Sie eine konsistente Präzision über Zahlen mit unterschiedlichen Größenordnungen hinweg benötigen. Dieser Ansatz ist in wissenschaftlichen, technischen und Datenvisualisierungskontexten üblich.

Verwenden Sie signifikante Stellen für wissenschaftliche Messungen und Berechnungen. Laborergebnisse, Sensormesswerte und physikalische Messungen müssen oft die Präzision des Messinstruments widerspiegeln. Die konsistente Anzeige von drei signifikanten Stellen kommuniziert Präzision unabhängig davon, ob die Messung 0,0123, 1,23 oder 123 beträgt.

const measurement = new Intl.NumberFormat("en-US", {
  maximumSignificantDigits: 4,
});

console.log(measurement.format(0.012345));
// Output: "0.01235"

console.log(measurement.format(1.2345));
// Output: "1.235"

console.log(measurement.format(1234.5));
// Output: "1,235"

Verwenden Sie signifikante Stellen für Dashboard-Metriken, die Zahlen mit unterschiedlichen Größenordnungen anzeigen. Bei der Anzeige von Statistiken wie Seitenaufrufen, Umsätzen oder Benutzerzahlen verhindern signifikante Stellen, dass winzige Zahlen übermäßige Präzision anzeigen, während große Zahlen lesbar bleiben.

const metric = new Intl.NumberFormat("en-US", {
  maximumSignificantDigits: 3,
});

console.log(metric.format(1.234));
// Output: "1.23"

console.log(metric.format(123.4));
// Output: "123"

console.log(metric.format(12345));
// Output: "12,300"

Verwenden Sie Dezimalstellen für Währungs- und Finanzbeträge, bei denen der Bruchteil Cent oder andere feste Währungsunterteilungen darstellt. Diese Beträge benötigen konsistente Dezimalstellen unabhängig von der Größenordnung.

const currency = new Intl.NumberFormat("en-US", {
  style: "currency",
  currency: "USD",
  minimumFractionDigits: 2,
  maximumFractionDigits: 2,
});

console.log(currency.format(1.5));
// Output: "$1.50"

console.log(currency.format(123.5));
// Output: "$123.50"

Die Wahl zwischen diesen Ansätzen hängt davon ab, ob sich die Präzision auf die Gesamtzahl der Stellen oder auf eine feste Bruchkomponente bezieht.