Heim >Web-Frontend >js-Tutorial >Vorbereitung auf ECMascript 6: Neue Zahlenmethoden
Dieser Artikel behandelt neue und verbesserte Zahlenmethoden in ES6 (ECMascript 6).
Es ist Teil einer Reihe zu den neuen Funktionen von ES6, in der wir auch neue Methoden für die String- und Array -Datentypen erörtert haben, aber auch neue Arten von Daten wie MAP und Schwächen.
Ich werde Sie mit den neuen Methoden und Konstanten, die dem Zahlendatentyp hinzugefügt wurden, vorstellen. Einige der Zahlenmethoden sind, wie wir sehen werden, überhaupt nicht neu, aber sie wurden verbessert und/oder unter das richtige Objekt bewegt (z. B. isnan ()). Wie immer werden wir auch das neue Wissen mit einigen Beispielen in die Tat umsetzen. Also, ohne weiteres, lass uns anfangen.
Nur zum Spaß habe ich versucht, diese Funktion neu zu erstellen und endete mit einem anderen Ansatz:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && number % 1 === 0; </span><span>}; </span>
Beide Funktionen sind gut und nützlich, respektieren jedoch die ECMAScript 6 -Spezifikationen nicht. Wenn Sie diese Methode also Polyfülle haben möchten, benötigen Sie etwas Komplexeres, wie wir in Kürze sehen werden. Beginnen wir für den Moment, indem wir die Zahlensyntax entdecken. Issinterger ():
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && Math.floor(number) === number; </span><span>}; </span>
Das Zahlenargument repräsentiert den Wert, den Sie testen möchten.
<span>Number.isInteger(number) </span>
Einige Beispiele für die Verwendung dieser Methode sind unten dargestellt:
Eine Live -Demo des vorherigen Code ist unten angezeigt und ist auch bei JSBIN erhältlich.
<span>// prints 'true' </span><span>console.log(Number.isInteger(19)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger(3.5)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger([1, 2, 3])); </span>
Die Methode wird mit Ausnahme des Internet Explorer im Knoten und allen modernen Browsern unterstützt. Wenn Sie ältere Browser unterstützen müssen, können Sie ein Polyfill verwenden, wie das im Mozilla Developer -Netzwerk auf der Seite Methoden verfügbar. Dies wird auch unten für Ihre Bequemlichkeit reproduziert:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && number % 1 === 0; </span><span>}; </span>
Wenn Sie in der Vergangenheit einen JavaScript -Code geschrieben haben, sollte diese Methode für Sie nicht neu sein. Seit einiger Zeit hat JavaScript eine Methode namens isnan (), die über das Fensterobjekt freigelegt wird. Diese Methode testet, wenn ein Wert gleich NAN ist. In diesem Fall gibt er wahr oder auf andere Weise falsch zurück. Das Problem mit window.isnan () ist, dass es ein Problem darin hat, dass es auch für Werte, die in eine Zahl konvertiert hat, zu einer Nummer zurückgibt. Um Ihnen eine konkrete Vorstellung von diesem Problem zu geben, geben alle folgenden Aussagen wahr:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && Math.floor(number) === number; </span><span>}; </span>Was Sie möglicherweise benötigen, ist eine Methode, die nur dann wahr zurückgibt, wenn der NAN -Wert übergeben wird. Aus diesem Grund hat die ECMAScript 6 die Nummer isnan () Methode eingeführt. Die Syntax ist so ziemlich das, was Sie erwarten würden:
<span>Number.isInteger(number) </span>Hier ist der Wert der Wert, den Sie testen möchten. Einige Beispielanwendungen dieser Methode sind unten angezeigt:
<span>// prints 'true' </span><span>console.log(Number.isInteger(19)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger(3.5)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger([1, 2, 3])); </span>Wie Sie sehen können, testen wir die gleichen Werte, wir erhalten unterschiedliche Ergebnisse.
Eine lebende Demo des vorherigen Snippets ist unten gezeigt und ist auch bei JSBIN erhältlich.
Die Methode wird mit Ausnahme des Internet Explorer im Knoten und allen modernen Browsern unterstützt. Wenn Sie andere Browser unterstützen möchten, ist eine sehr einfache Polyfill für diese Methode Folgendes:
<span>if (!Number.isInteger) { </span> <span>Number.isInteger = function isInteger (nVal) { </span> <span>return typeof nVal === 'number' && </span> <span>isFinite(nVal) && </span> nVal <span>> -9007199254740992 && </span> nVal <span>< 9007199254740992 && </span> <span>Math.floor(nVal) === nVal; </span> <span>}; </span><span>} </span>Der Grund, warum dies funktioniert
number.isfinite ()
Aus diesem Grund gibt es in ECMascript 6 eine Methode namens isfinite (), die zur Anzahl gehört. Seine Syntax ist die folgende:
<span>// prints 'true' </span><span>console.log(window.isNaN(0/0)); </span> <span>// prints 'true' </span><span>console.log(window.isNaN('test')); </span> <span>// prints 'true' </span><span>console.log(window.isNaN(undefined)); </span> <span>// prints 'true' </span><span>console.log(window.isNaN({prop: 'value'})); </span>
Hier ist der Wert der Wert, den Sie testen möchten. Wenn Sie die gleichen Werte aus dem vorherigen Snippet testen, können Sie feststellen, dass die Ergebnisse unterschiedlich sind:
<span>Number.isNaN(value) </span>
Eine lebende Demo des vorherigen Snippets ist unten gezeigt und ist auch bei JSBIN erhältlich.
<span>// prints 'true' </span><span>console.log(Number.isNaN(0/0)); </span> <span>// prints 'true' </span><span>console.log(Number.isNaN(NaN)); </span> <span>// prints 'false' </span><span>console.log(Number.isNaN(undefined)); </span> <span>// prints 'false' </span><span>console.log(Number.isNaN({prop: 'value'})); </span>Die Methode wird mit Ausnahme des Internet Explorer im Knoten und allen modernen Browsern unterstützt. Auf der Seite der Methode finden Sie auf MDN eine Polyfill dafür.
Die Methode der Nummer.ISSAFINTEERGER () ist eine völlig neue Ergänzung zu ES6. Es wird getestet, ob der übergebene Wert eine Zahl ist, die eine sichere Ganzzahl ist. In diesem Fall gibt er True zurück. Eine sichere Ganzzahl ist definiert als eine Ganzzahl, die beide die folgenden zwei Bedingungen erfüllt:
Basierend auf dieser Definition sind sichere Ganzzahlen alle Ganzzahlen von -(2 53 -1) einschließlich 2 53 -1 inklusive. Diese Werte sind wichtig und wir werden sie am Ende dieses Abschnitts ein wenig mehr besprechen.
Die Syntax dieser Methode lautet:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && number % 1 === 0; </span><span>}; </span>
Hier ist der Wert der Wert, den Sie testen möchten. Einige Beispielanwendungen dieser Methode sind unten dargestellt:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && Math.floor(number) === number; </span><span>}; </span>
Eine Live -Demo dieses Code ist unten angezeigt und auch bei JSBIN verfügbar.
Die Zahl.ISSAFINTEERGER () wird mit Ausnahme des Internet Explorer im Knoten und allen modernen Browsern unterstützt. Eine Polyfill für diese Methode, die von Paul Miller aus ES6-Shim extrahiert wurde, lautet:
<span>Number.isInteger(number) </span>
Beachten Sie, dass diese Polyfill auf der Zahl beruht. Issinger () Methode, die zuvor diskutiert wurde, müssen Sie also auch die Letzteres Polyfülle haben, um diese zu verwenden.
ecmascript 6 führte auch zwei verwandte konstante Werte ein: number.max_safe_integer und number.min_safe_integer. Ersteres repräsentiert die maximale sichere Ganzzahl in JavaScript -dh 2 53 -1 -während letzteres die minimale sichere Ganzzahl, nämlich -(2 53 -1). Wie Sie vielleicht bemerken, sind dies die gleichen Werte, die ich zuvor zitiert habe.
Die Nummer.ParseInt () und number.Parsefloat () Methoden werden im selben Abschnitt behandelt alte globale Version. Sie können sie also auf die gleiche Weise verwenden, wie Sie es bisher gemacht haben, und Sie können die gleichen Ergebnisse erwarten. Der Zweck des Hinzufügens dieser Methoden zur Anzahl ist die Modularisierung von Globalen.
Aus Gründen der Vollständigkeit melde ich ihre Syntax:
<span>// prints 'true' </span><span>console.log(Number.isInteger(19)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger(3.5)); </span> <span>// prints 'false' </span><span>console.log(Number.isInteger([1, 2, 3])); </span>
Hier repräsentiert String den Wert, den Sie analysieren möchten, und Radix ist der Radix, den Sie verwenden möchten, um die Zeichenfolge zu konvertieren.
Das folgende Snippet zeigt einige Beispiele verwendet:
<span>if (!Number.isInteger) { </span> <span>Number.isInteger = function isInteger (nVal) { </span> <span>return typeof nVal === 'number' && </span> <span>isFinite(nVal) && </span> nVal <span>> -9007199254740992 && </span> nVal <span>< 9007199254740992 && </span> <span>Math.floor(nVal) === nVal; </span> <span>}; </span><span>} </span>
Eine Live -Demo dieses Codes wird unten angezeigt und ist auch bei JSBIN erhältlich.
Diese Methoden werden mit Ausnahme des Internet Explorer im Knoten und in allen modernen Browsern unterstützt. Falls Sie sie Polyfülle haben möchten, können Sie einfach ihre zugehörige globale Methode wie unten aufgeführt bezeichnen:
<span>Number.isInteger = Number.isInteger || function (number) { </span> <span>return typeof number === 'number' && number % 1 === 0; </span><span>}; </span>
Die folgende Grafik zeigt die Browserunterstützung für Erweiterungen zum integrierten Zahlenobjekt in ES6. Maus über die Kisten, um die prozentuale Verwendung der jeweiligen Browserversionen zu sehen.
Kann ich ES6-Number verwenden? Daten zur Unterstützung der ES6-Number-Funktion in den wichtigsten Browsern von caniuse.com.
In diesem Tutorial haben wir die neuen Methoden und Konstanten in ECMascript 6 behandelt, die mit dem Zahlendatentyp funktionieren. Es ist erwähnenswert, dass ES6 auch eine weitere Konstante hinzugefügt hat, die ich bisher noch nicht erwähnt habe. Dies ist Zahl.epsilon und repräsentiert den Unterschied zwischen einem und dem kleinsten Wert, der größer als einen ist, der als Zahl dargestellt werden kann. 🎜>
häufig gestellte Fragen (FAQs) zu ES6 -Zahlenmethoden
was Ist die Verwendung von nummer.isfinite () Methode in ES6? Dies unterscheidet sich von der globalen Funktion isfinite (), die sein Argument vor dem Testen in eine Zahl umwandelt. Number.isfInite () führt diese Konvertierung nicht durch, sodass es nur true zurückgibt, wenn das Argument eine endliche Zahl ist, und nicht, wenn das Argument ein Wert ist, der nicht in eine Zahl konvertiert werden kann. Die number.Parsefloat () -Methode funktioniert in ES6? Dies bedeutet, dass Sie es eher als Methode für das Zahlenobjekt als als eigenständige Funktion aufrufen können. Die Funktionalität ist gleich - sie analysiert ein String -Argument und gibt eine schwimmende Punktzahl zurück. Die Methode in ES6 wird verwendet, um festzustellen, ob ein Wert eine Ganzzahl ist. Diese Methode gibt true zurück, wenn der Wert eine Zahl ist, die nicht unendlich ist, nicht NAN, und ohne eine fraktionierte Komponente ausgedrückt werden kann. Es ist nützlich, wenn Sie überprüfen müssen, ob eine Zahl eine Ganzzahl ist, was bei bestimmten mathematischen Operationen wichtig sein kann.
Das obige ist der detaillierte Inhalt vonVorbereitung auf ECMascript 6: Neue Zahlenmethoden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!