Dateinamenerweiterungen in JavaScript abrufen

Nithin Krishnan 12 Oktober 2023
  1. Erhalten Sie Dateierweiterung mit der .split() und .pop() Methoden in JavaScript
  2. Abrufen der Dateierweiterung mit der Methode .substr() in JavaScript
  3. Abrufen der Dateierweiterung mit der Methode .slice() in JavaScript
  4. Dateierweiterung mit der Methode ES6-Objektdestrukturierung abrufen
Dateinamenerweiterungen in JavaScript abrufen

Dateinamen haben eine Erweiterung, die dem Betriebssystem und dem Benutzer hilft, den Dateityp zu identifizieren. Die meisten Erweiterungen sind drei Zeichen lang, manchmal können es jedoch auch mehr sein. Zum Beispiel waren die älteren Microsoft Office-Erweiterungen wie .doc, .xls, .ppt früher drei Zeichen lang, aber die neueren Erweiterungen wie .docx, .xlsx, .pptx sind vier Zeichen. Sehen wir uns einige Möglichkeiten an, um den Erweiterungsteil mit integrierten Javascript-Methoden aus einem Dateinamen zu extrahieren.

Erhalten Sie Dateierweiterung mit der .split() und .pop() Methoden in JavaScript

Die Funktion .split() teilt einen String in ein Array von Strings auf. Es zerlegt den string in ein array von Teilstrings basierend auf einem Muster, das als erster Parameter an die Funktion übergeben wird. Und .pop() ist eine eingebaute Funktion in Javascript, die das letzte Element eines Arrays entfernt und zurückgibt. Daher können wir eine Kombination dieser Methoden verwenden, um die Erweiterung aus einem Dateinamen zu ermitteln. Schauen wir uns den folgenden Code an, um die Verwendung zu verstehen.

let file1 = 'somefile.txt';
let file2 = 'somefile.xlsx';
console.log(file1.split('.').pop());
console.log(file2.split('.').pop());

Ausgabe:

txt
xlsx

Im Code verwenden wir die Funktion .split("."), um die DateinamensZeichenkette durch . aufzuteilen. um es in mehrere Teile zu zerlegen. Die Funktion .pop() gibt den letzten Wert des defekten Dateinamen-Arrays zurück. Die JavaScript-Funktion .pop() ändert das String-Array, auf das wir sie anwenden.

Der Ansatz funktioniert auch für Dateinamen mit mehreren . in ihnen. Die .split(".").pop() gibt das letzte Stück des geteilten Dateinamens zurück. Daher ist es eine intelligente Methode, um die Dateierweiterung von einem bestimmten Dateinamen zu erhalten.

Abrufen der Dateierweiterung mit der Methode .substr() in JavaScript

Zum Extrahieren der Dateinamen verwenden wir String-Operationen, da wir es mit dem Dateinamen-String zu tun haben. Eine andere Möglichkeit, die Erweiterung zu erhalten, besteht darin, die Funktion substr() zu verwenden. Wie der Name schon sagt, gibt die Funktion substring() ein Stück einer Zeichenkette zurück, das durch die dieser Funktion als Parameter übergebenen Indizes definiert wird. Es benötigt zwei Parameter, den Startindex und den Endindex. Die Funktion gibt den String zwischen dem Anfangs- und dem Endindex zurück, einschließlich des Zeichens am Startindex und ohne das Zeichen am Endindex. Daher können wir die Funktion substring verwenden, um die Erweiterung einer Datei zu extrahieren. Siehe den folgenden Code.

let file1 = 'somefile.txt';
let file2 = 'somefile.xlsx';
console.log(file1.substr(-3));
console.log(file2.substr(-4));

Ausgabe:

txt
xlsx
Notiz

Wie im obigen Code dargestellt, akzeptiert die Funktion substr() auch negative Integer-Werte als Parameter. Im Gegensatz zu den üblichen Start- und Endindizes fordert der negative Integer-Wert die Methode auf, die letzten paar Zeichen des Strings anzuzeigen, wie durch den numerischen Parameter angegeben.

Verwenden Sie substr() nur, wenn wir uns über die Länge der Erweiterung sicher sind. Andernfalls verwenden Sie lieber den folgenden narrensicheren Code, wenn wir die Länge der Dateierweiterung nicht kennen. Der folgende Code zeigt eine solche Verwendung. Es verwendet die Funktion lastIndexOf() in Javascript, um die letzte Position herauszufinden, an der das . ist vorhanden und verwendet es dann als Verweis, um die Erweiterung zurückzugeben.

let file1 = 'somefile.txt';
let file2 = 'somefile.xlsx';
console.log(file1.substr((file1.lastIndexOf('.') + 1 - file1.length)));
console.log(file2.substr((file2.lastIndexOf('.') + 1 - file2.length)));

Ausgabe:

txt
xlsx

Abrufen der Dateierweiterung mit der Methode .slice() in JavaScript

Wir haben es mit dem String-Datentyp für den Dateinamen zu tun. Daher können wir die Operatoren string anwenden. Ein solcher Operator ist .slice(). Sie funktioniert ähnlich wie die Funktion substr() und gibt einen durch den start index und den end index definierten Array-Abschnitt zurück. Wenn wir nur einen Wert an die Funktion slice() übergeben, wird dieser Indexwert als start index betrachtet. Und gibt die Zeichenkette von diesem Punkt aus zurück. Lesen Sie den folgenden Code zur Verwendung von Slice, um die Dateierweiterung abzurufen.

let file1 = 'somefile.txt';
let file2 = 'somefile.xlsx';
console.log(file1.slice(((file1.lastIndexOf('.') - 1) + 2)));
console.log(file2.slice(((file2.lastIndexOf('.') - 1) + 2)));

Ausgabe:

txt
xlsx

Die Funktion .slice() manipuliert nicht den String, auf den wir sie anwenden. Daher können wir die Methode ohne Bedenken problemlos anwenden. Es ist auch eine schnellere Methode, die Dateierweiterung aus der DateinamensZeichenkette zu extrahieren.

Dateierweiterung mit der Methode ES6-Objektdestrukturierung abrufen

Die Objektdestrukturierung ist eine neuere Funktion, die im ES6-Standard eingeführt wurde. Damit können wir ein Javascript-Objekt aufbrechen und diese Eigenschaften an Variablen binden. Wir können es verwenden, um die Erweiterung aus einem Dateinamen zu erhalten. Siehe den folgenden Code.

let file1 = 'somefile.txt';
const [ext, ...fileName] = file1.split('.').reverse();
console.log(ext);

Ausgabe:

txt

Der Code verwendet die Funktion split(".") von Javascript, um den Dateinamen mit dem "." aufzuteilen, um ein Array von Dateinamenteilen zu erhalten. Es enthält den Dateinamen und die Erweiterungen, die in verschiedenen Indizes des von der Funktion .split() ausgegebenen Arrays zurückgegeben werden. Die Methode .reverse() kehrt das Array um, auf das wir sie anwenden. Das erste Element des umgekehrten Arrays enthält den Erweiterungswert. Wir extrahieren weiter die Variable ext in [ext, ...fileName] unter Verwendung des JavaScript-Objekt-Destrukturierungsmechanismus von ES6-Javascript. Schließlich können wir das ext protokollieren, um die Dateiendung zu erhalten.

Verwandter Artikel - JavaScript File