Überprüfen Sie in Typescript, ob eine Zeichenfolge numerisch ist


179

In Typescript zeigt dies einen Fehler an, der besagt, dass isNaN nur numerische Werte akzeptiert

isNaN('9BX46B6A')

und dies gibt false zurück, weil zu parseFloat('9BX46B6A')ausgewertet wird9

isNaN(parseFloat('9BX46B6A'))

Ich kann immer noch mit dem Fehler arbeiten, der in Visual Studio angezeigt wird, aber ich würde es gerne richtig machen.

Derzeit habe ich diese modifizierte Funktion geschrieben -

static isNaNModified = (inputStr: string) => {
    var numericRepr = parseFloat(inputStr);
    return isNaN(numericRepr) || numericRepr.toString().length != inputStr.length;
}

Antworten:


334

Die Konvertierung einer Zeichenfolge in eine Zahl erfolgt mit Number, nicht mit parseFloat.

Number('1234') // 1234
Number('9BX9') // NaN

Sie können auch den unären Plus-Operator verwenden, wenn Sie die Kurzform mögen:

+'1234' // 1234
+'9BX9' // NaN

Seien Sie vorsichtig, wenn Sie gegen NaN prüfen (der Bediener ===und arbeiten !==Sie nicht wie erwartet mit NaN). Verwenden:

 isNaN(maybeNumber) // returns true if NaN, otherwise false

18
Bedeutet das, dass dies der Fall ist: if (isNaN (+ requiredNumberString)) ist eine gültige Methode zur Überprüfung?
Mathijs Segers

5
Warum würden Sie Numberoben parseIntoder verwenden parseFloat? Number('')gibt 0, während parseInt('')gibt, NaNwas mehr im Einklang mit dem steht, was ich erwarte.
Didii

6
Wie in der ursprünglichen Frage erwähnt , werden parseInt('9BX9')(und parseFloat('9BX9')) 9nicht zurückkehren NaN. Wenn Sie nicht möchten, dass eine leere Zeichenfolge in 0 konvertiert wird, suchen Sie zuerst explizit nach einer leeren Zeichenfolge.
C Snover

1
Wenn Sie danach suchen möchten, verwenden Sie isNaN(Number(what_ever))anstelle von Number(what_ever) === Nan.
k0pernikus

3
@sauntimo Numberist keine TypeScript-Sache, sondern eine integrierte EcmaScript-Konstruktorfunktion, die einen Wert akzeptiert und ein Zahlenprimitiv zurückgibt, wenn sie als Funktion und nicht als Konstruktor aufgerufen wird.
C Snover

46

Update 2

Diese Methode ist in rxjs v6 nicht mehr verfügbar

Ich habe es gelöst, indem ich den isNumeric- Operator aus der rxjs- Bibliothek verwendet habe (Importieren von rxjs / util / isNumeric)

Aktualisieren

import { isNumeric } from 'rxjs/util/isNumeric';

. . .

var val = "5700";
if (isNumeric(val)){
   alert("it is number !");
}

5
Diese Methode ist in rxjs v6 nicht mehr verfügbar.
Logic01

33
function isNumber(value: string | number): boolean
{
   return ((value != null) &&
           (value !== '') &&
           !isNaN(Number(value.toString())));
}

3

Ich würde eine vorhandene und bereits getestete Lösung wählen. Zum Beispiel dies von rxjs in Typoskript:

function isNumeric(val: any): val is number | string {
  // parseFloat NaNs numeric-cast false positives (null|true|false|"")
  // ...but misinterprets leading-number strings, particularly hex literals ("0x...")
  // subtraction forces infinities to NaN
  // adding 1 corrects loss of precision from parseFloat (#15100)
  return !isArray(val) && (val - parseFloat(val) + 1) >= 0;
}

rxjs / isNumeric.ts

Ohne die Funktion rxjs isArray () und mit einfachen Eingaben:

function isNumeric(val: any): boolean {
  return !(val instanceof Array) && (val - parseFloat(val) + 1) >= 0;
}

Sie sollten solche Funktionen immer mit Ihren Anwendungsfällen testen. Wenn Sie spezielle Werttypen haben, ist diese Funktion möglicherweise nicht Ihre Lösung. Hier können Sie die Funktion testen.

Ergebnisse sind:

enum         : CardTypes.Debit   : true
decimal      : 10                : true
hexaDecimal  : 0xf10b            : true
binary       : 0b110100          : true
octal        : 0o410             : true
stringNumber : '10'              : true

string       : 'Hello'           : false
undefined    : undefined         : false
null         : null              : false
function     : () => {}          : false
array        : [80, 85, 75]      : false
turple       : ['Kunal', 2018]   : false
object       : {}                : false

Wie Sie sehen, müssen Sie vorsichtig sein, wenn Sie diese Funktion mit Aufzählungen verwenden.



1

Die meiste Zeit ist der Wert, den wir überprüfen möchten, Zeichenfolge oder Zahl, also hier ist die Funktion, die ich benutze:

const isNumber = (n: string | number): boolean => 
    !isNaN(parseFloat(String(n))) && isFinite(Number(n));

Codesandbox-Tests .

const willBeTrue = [0.1, '1', '-1', 1, -1, 0, -0, '0', "-0", 2e2, 1e23, 1.1, -0.1, '0.1', '2e2', '1e23', '-0.1', ' 898', '080']

const willBeFalse = ['9BX46B6A', "+''", '', '-0,1', [], '123a', 'a', 'NaN', 1e10000, undefined, null, NaN, Infinity, () => {}]

1

Sie können die Number.isFinite()Funktion verwenden:

Number.isFinite(Infinity);  // false
Number.isFinite(NaN);       // false
Number.isFinite(-Infinity); // false
Number.isFinite('0');       // false
Number.isFinite(null);      // false

Number.isFinite(0);         // true
Number.isFinite(2e64);      // true

Hinweis: Es gibt einen signifikanten Unterschied zwischen der globalen Funktion isFinite()und der letzteren Number.isFinite(). Im ersteren Fall wird ein Saitenzwang durchgeführt - also isFinite('0') === truewährendNumber.isFinite('0') === false .

Beachten Sie auch, dass dies im IE nicht verfügbar ist!


Aber ... TS2345: Das Argument vom Typ '"1"' kann keinem Parameter vom Typ 'Nummer' zugewiesen werden. Es muss Number.isFinite (Number ('0')) sein;
Mcgri

0

Für vollständige Zahlen (Nicht-Floats) in Angular können Sie Folgendes verwenden:

if (Number.isInteger(yourVariable)) { ... }


1
Number.isIntegersagt dir nur, ob yourVariable, was bereits ein numberTyp ist, eine ganze Zahl ist. Funktioniert nicht mit Strings. So Number.isInteger(Number(yourVariable))könnte den Trick tun.
Teerball

-2

Ob eine Zeichenfolge als Zahl analysiert werden kann, ist ein Laufzeitproblem. Typescript unterstützt diesen Anwendungsfall nicht, da es sich auf die Sicherheit bei der Kompilierung (nicht zur Laufzeit) konzentriert.


11
Es ist schon ein Problem, es als Fehler zu markieren, als ob es nicht korrekt wäre.
Jane Panda
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.