Kategorien
JavaScript & jQuery Programmierung

Zahl, E-Mail-Adresse oder Datum: is.js findet es heraus

Die JavaScript-Bibliothek is.js ist ein umfangreiches Werkzeug, um Zahlen, Zeichenketten, Arrays und Objekte auf bestimmte Eigenschaften zu überprüfen. So lässt sich mit is.js zum Beispiel feststellen, ob es sich bei einer Zeichenkette um ein Datum oder eine E-Mail-Adresse handelt. Auch lässt sich herausfinden, ob ein Wert beispielsweise ein Array oder ein boolescher Ausdruck ist. Die Bibliothek umfasst zahlreiche Methoden, die zur Validierung von Formulareingaben oder für Rechenoperationen eingesetzt werden können. Die Verwendung von is.js ist dabei so einfach und intuitiv, dass es keiner umfangreichen Dokumentation bedarf.

isjs-teaser_DE

Einfacher Einstieg

Da is.js ohne jQuery oder andere Bibliotheken auskommt, genügt es also, die JavaScript-Datei is.js am Ende des HTML-Bodys einzubinden. Anschließend stehen einem alle Methoden zur Verfügung. Um beispielsweise festzustellen, ob es sich bei einem Wert um eine Zahl handelt, genügt der Aufruf von „is.number()“. Handelt es sich bei dem übergebenen Wert tatsächlich um eine Zahl, gibt die Methode „true“ zurück, andernfalls „false“.

is.number(32);

Im Beispiel wird „true“ zurückgegeben. Alternativ gibt es bei allen Methoden auch die Möglichkeit, eine umgekehrte Prüfung mit „is.not“ durchzuführen – zum Beispiel: „is.not.number()“.

is.not.number(32);

In diesem Fall würde das Beispiel „false“ zurückgeben.

Eine Besonderheit von is.js besteht darin, mehrere Werte gleichzeitig prüfen zu können. Dazu übergibt man mehrere Zahlen oder Zeichenketten entweder einfach per Komma voneinander getrennt oder als Array. Per „is.all“ oder „is.any“ kann dann geprüft werden, ob alle Werte oder mindestens einer der Werte dem Kriterium der Methode entsprechen.

is.all.number(32, "vier");
is.all.number([32, "vier"]);

Das Beispiel zeigt die beiden unterschiedlichen Möglichkeiten der Schreibweise – nur per Komma und als Array. Im Beispiel wird die Methode „false“ zurückgeben, da der zweite Wert jeweils eine Zeichenkette und keine Zahl ist.

is.any.number(32, "vier");
is.any.number([32, "vier"]);

Nimmt man statt „is.all.number()“ nun „is.any.number()“, wird im Beispiel „true“ wiedergegeben, da mindestens einer der übergebenen Werte eine Zahl ist.

isjs

Vom Prinzip funktionieren die allermeisten Methoden von is.js auf diese Weise. „is.number()“ gehört hierbei zu einer von 16 Methoden, mit denen der Typ eines Wertes geprüft werden kann. Zu den weiteren Methoden zur Erkennung eines Typs gehören zum Beispiel „is.string()“ für Zeichenketten, „is.boolean()“ für boolesche Ausdrücke und „is.array()“ für Arrays.

is.array(["Apfel", "Birne"]);
is.all.array(["Apfel", "Birne"], "Kirsche");

Auch bei „is.array()“ lassen sich mehrere Werte gleichzeitig überprüfen. Während der erste Aufruf im Beispiel „true“ wiedergibt, wird im zweiten „false“ wiedergegeben, da dort neben einem Array auch eine einfache Zeichenkette aufgeführt ist.

Neben der Typ-Methoden gibt es zudem einige Methoden, mit denen beispielsweise Arrays und Ausdrücke darauf hin geprüft werden können, ob sie vorhanden, leer, wahr oder falsch sind.

is.existy({});
is.empty({});

Im Beispiel wird jeweils ein leeres Literalobjekt übergeben. Sowohl „is.existy()“ als auch „is.empty()“ werden „true“ rückmelden, da das Literalobjekt sowohl vorhanden als auch leer ist.

Mit regulären Ausdrücken Zeichenktten prüfen

Zwar bieten die neuen HTML-Eingabefelder die Möglichkeit, E-Mail-Adressen und URLs auf ihre Validität zu überprüfen. Dennoch gibt es auch per is.js diese und andere Methoden, um bestimmte Zeichenketten anhand vordefinierter regulärer Ausdrücke zu validieren.

So stehen einem neben „is.email()“ und „is.url()“ weitere Methoden wie „is.dateString()“ und „is.timeString()“ zur Verfügung, mit denen geprüft wird, ob ein Wert einer Datums- beziehungsweise Zeitangabe entspricht.

is.dateString("03/05/2015");
is.timeString("13:45:30");

Auch Kreditkartennummern sowie US-amerikanische und kanadische Postleitzahlen können mit entsprechenden Methoden verifiziert werden. Mit „is.ip()“, „is.ipv4()“ und „is.ipv6()“ püft man zudem IP-Adressen. Insgesamt 18 Methoden stehen bereit, um Zeichenketten nach einem bestimmten Muster prüfen zu lassen.

Browser und Betriebssysteme feststellen

Gerade für komplexe Webanwendungen ist es häufig wichtig, den verwendeten Browser beziehungsweise das verwendete Betriebssystem ausfindig zu machen. Auch hier stellt is.js einige Möglichkeiten zur Verfügung. Statt sich aus den Angaben des User-Agents die entsprechenden Informationen herauszusuchen, verfügt es mit „is.firefox()“, „is.chrome()“ und „is.ie()“ über einfache Methoden, um den verwendeten Browser festzustellen.

is.ie();
is.ie(7);

In den beiden Beispielen wird zunächst geprüft, ob der Internet Explorer in einer beliebigen Version verwendet wird. Wird der Methode eine Versionsnummer übergeben, wird auch diese bei der Verifizierung berücksichtigt. Das zweite Beispiel prüft also explizit, ob der Internet Explorer in der Version 7 genutzt wird.

Mit „is.android“, „is.ios()“ und „is.windows()“ lässt sich zudem das verwendete Betriebssystem ganz leicht feststellen. Bestimmte Versionen können hierbei jedoch nicht berücksichtigt werden.

Gerade bei der Entwicklung von Webanwendungen für Mobilgeräte kann es wichtig sein, den Gerätetyp festzustellen. Mit „is.tablet()“, „is.mobile()“ und „is.desktop()“ kann zwischen Tablet, Smartphone und klassischem Desktoprechner unterschieden werden. Außerdem lässt sich bei den Mobilgeräten noch herausfinden, ob es sich um Android- oder Windows-Geräte handelt – mit „is.androidTablet()“ und „is.windowsTablet()“.

is.androidTablet();
is.windowsTablet();

Zeiten prüfen

Mit Zeiten zu rechnen, ist nicht immer einfach. Daher stellt is.js hierfür einige ebenso praktische wie einfache Methoden bereit. So kann man mit „is.today()“ zum Beispiel herausfinden, ob eine Zeitangabe dem aktuellen Tag entspricht. Mit „is.yesterday()“ und „is.tomorrow()“ wird hingegen geprüft, ob eine Zeitangabe dem gestrigen beziehungsweise morgigen Tag entspricht.

„is.past()“ und „is.future()“ stellen fest, ob ein Datum in der Vergangenheit oder der Zukunft liegt.

is.today(new Date());

Im Beispiel wird geprüft, ob die aktuelle Zeit dem heutigen Tag entspricht. In diesem Fall wird immer „true“ wiedergegeben.

Mit „is.day()“, „is.month()“ und „is.year()“ kann man darüber hinaus feststellen, ob ein Datum an einem bestimmten Wochentag, in einem bestimmten Monat oder Jahr liegt. Dazu wird den Methoden zum einen das Datum, zum anderen der Wochentag, Monat beziehungsweise das Jahr übergeben, für welches das Datum geprüft werden soll.

is.day(new Date("01/26/2015"), "monday");

Im Beispiel wird geprüft, ob der 26. Januar 2015 ein Montag war.

„is.inDateRange()“ verrät, ob eine Zeitangabe innerhalb eines bestimmten Zeitraums liegt. Dazu wird die zu überprüfende Zeitangabe sowie Anfangs- und Endzeit der Zeitspanne übergeben.

is.inDateRange(new Date("01/25/2015"), new Date("01/24/2015"), new Date('01/26/2015"));

Hier wird geprüft, ob der 25. Januar 2015 zwischen dem 24. und 26. Januar des Jahres liegt.

Insgesamt gibt es 20 verschiedene Methoden zur Überprüfung von Zeitangaben. Unter anderem lassen sich noch Wochenenden („is.weekend()“), Schaltjahre („is.leapYear()“) und Jahresquartale („is.quarterOfYear()“) feststellen.

Lizenz und Link zum Beitrag

is.js steht unter der MIT-Lizenz, kann also für beliebige Projekte verwendet werden. Die Datei ist in der komprimierten Form keine 14 Kilobyte groß.

(dpe)

Von Denis Potschien

Denis Potschien ist seit 2005 freiberuflich als Kommunikationsdesigner tätig, seit Anfang 2010 im Kreativkonsulat in Iserlohn, einem Büro für Gestaltung und Kommunikation. Dort betreut er kleine und mittelständische Unternehmen ebenso wie kommunale Körperschaften und Organisationen aus Südwestfalen und dem Ruhrgebiet.

Als Webdesigner und -entwickler gehören HTML5 und CSS3 zu seinen Kernthemen, weshalb er dazu 2013 ein Buch geschrieben hat. „Pure HTML5 und CSS3“ richtet sich an alle, die Vorkenntnisse haben, sich aber bisher mit HTML5 und CSS3 nicht oder nur am Rande beschäftigt haben.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.