Wie kann ich Dateierweiterungen mit JavaScript erhalten?

Lesezeit: 5 Minuten

Wie kann ich Dateierweiterungen mit JavaScript erhalten
Sergio del Amo

Siehe Code:

var file1 = "50.xsl";
var file2 = "30.doc";
getFileExtension(file1); //returns xsl
getFileExtension(file2); //returns doc

function getFileExtension(filename) {
    /*TODO*/
}

1646261115 840 Wie kann ich Dateierweiterungen mit JavaScript erhalten
Wallace

return filename.split('.').pop();

Bearbeiten:

Dies ist eine weitere Nicht-Regex-Lösung, die meiner Meinung nach effizienter ist:

return filename.substring(filename.lastIndexOf('.')+1, filename.length) || filename;

Es gibt einige Eckfälle, die von der Antwort von VisioN unten besser behandelt werden, insbesondere Dateien ohne Erweiterung (.htaccess etc enthalten).

Es ist sehr leistungsfähig und behandelt Eckfälle wohl besser, indem es zurückkehrt "" anstelle der vollständigen Zeichenfolge, wenn kein Punkt oder keine Zeichenfolge vor dem Punkt steht. Es ist eine sehr gut ausgearbeitete Lösung, wenn auch schwer zu lesen. Stecken Sie es in Ihre Helferbibliothek und verwenden Sie es einfach.

Alte Bearbeitung:

Eine sicherere Implementierung, wenn Sie auf Dateien ohne Erweiterung oder versteckte Dateien ohne Erweiterung stoßen (siehe VisioNs Kommentar zu Toms Antwort oben), wäre etwas in dieser Richtung

var a = filename.split(".");
if( a.length === 1 || ( a[0] === "" && a.length === 2 ) ) {
    return "";
}
return a.pop();    // feel free to tack .toLowerCase() here if you want

Wenn a.length ist eine, es ist eine sichtbare Datei ohne Erweiterung, dh. Datei

Wenn a[0] === "" und a.length === 2 Es ist eine versteckte Datei ohne Erweiterung, dh. .htaccess

Dies sollte Probleme mit den etwas komplexeren Fällen klären. In Bezug auf die Leistung denke ich, dass diese Lösung in den meisten Browsern etwas langsamer ist als Regex. Für die meisten üblichen Zwecke sollte dieser Code jedoch vollkommen brauchbar sein.

  • Ich kann die Leistung nicht kommentieren, aber dieser sieht auf jeden Fall sauber aus! Ich benutze es. +1

    – pc1load1etter

    29. Juni 2010 um 4:17 Uhr

  • aber in diesem Fall sieht der Dateiname wie folgt aus: filname.tes.test.jpg. Bitte beachten Sie die Ausgabe. Ich hoffe, es wird falsch sein.

    – Fero

    2. Juli 2010 um 9:56 Uhr

  • in diesem Fall ist die Ausgabe “jpg”

    – Wallace

    28. September 2010 um 21:53 Uhr

  • Brillant! Vielen Dank. Es ist schön, eine Lösung zu sehen, die keine Regex verwendet; Ich habe dies mit PHP gemacht und es verwendet nur ein paar Funktionen. +1

    – Bojangles

    1. Dezember 2010 um 20:01 Uhr

  • @wallacer: Was passiert wenn filename hat eigentlich keine Erweiterung? Würde dies nicht einfach den Basisdateinamen zurückgeben, was ziemlich schlecht wäre?

    – Nicol Bolas

    26. Oktober 2011 um 20:33 Uhr

  • @mrbrdo Diese Methode soll nicht mit dem vollständigen Pfad nur mit Dateinamen funktionieren, wie in der Frage gefordert. Lesen Sie die Frage sorgfältig durch, bevor Sie sie ablehnen.

    – Vision

    13. Oktober 2013 um 15:55 Uhr

  • er hat das nie ausdrücklich gesagt, und es macht es offensichtlich nützlicher, wenn es auf Pfaden funktioniert

    – Mrbrdo

    18. Oktober 2013 um 15:29 Uhr

  • Warum so viel Aufwand betreiben, um eine so triviale Codezeile zu optimieren? Tilde- und Bitshift-Operatoren werden in JavaScript so selten gesehen, dass ich eine solche Antwort nicht unterstützen kann. Wenn es 5 Aufzählungspunkte braucht, um zu erklären, wie eine Codezeile funktioniert, schreiben Sie den Code besser so um, dass er tatsächlich verständlich ist.

    – Jackson

    8. Juli 2015 um 4:46 Uhr


  • Die Geschwindigkeit dieser einen Linie macht in keiner Anwendung einen wahrnehmbaren Unterschied. Bitwise wird so selten verwendet, dass beliebte Linters wie JSLint und JSHint davor warnen, sie zu verwenden. Die Besessenheit von der Leistung und Kompaktheit dieser Logik hat die Qualität des Codes verschlechtert; Wenn Code “zusätzliche Untersuchungen” erfordert, halte ich ihn für “schlecht”.

    – Jackson

    8. Juli 2015 um 19:11 Uhr

  • @Jackson Wenn man bedenkt, dass dies eine Website ist, auf der mehrere Lösungen für ein Problem angeboten werden, ist es nie schlecht, eine Lösung zu haben, die die Leistung optimiert. Ihre Aussage “wird in keiner Anwendung einen wahrnehmbaren Unterschied machen” basiert vollständig auf Ihrem engen Bereich möglicher Anwendungen, in denen dies verwendet werden könnte. Darüber hinaus kann es jemandem, der sich mit dem Problem befasst, eine Lernerfahrung bieten, in der er einige optimieren kann anderen Code, den sie für eine rechenintensive Anwendung, die sie schreiben, erstellen müssen.

    – nrylee

    27. Juni 2017 um 19:01 Uhr

Wie kann ich Dateierweiterungen mit JavaScript erhalten
Philho

function getFileExtension(filename)
{
  var ext = /^.+\.([^.]+)$/.exec(filename);
  return ext == null ? "" : ext[1];
}

Getestet mit

"a.b"     (=> "b") 
"a"       (=> "") 
".hidden" (=> "") 
""        (=> "") 
null      (=> "")  

Ebenfalls

"a.b.c.d" (=> "d")
".a.b"    (=> "b")
"a..b"    (=> "b")

  • Damit es im IE funktioniert: var pattern = “^.+\\.([^.]+)$”; var ext = new RegExp(pattern);

    – spc16670

    7. Oktober 2016 um 18:35 Uhr

1646261116 421 Wie kann ich Dateierweiterungen mit JavaScript erhalten
Dima

function getExt(filename)
{
    var ext = filename.split('.').pop();
    if(ext == filename) return "";
    return ext;
}

  • Damit es im IE funktioniert: var pattern = “^.+\\.([^.]+)$”; var ext = new RegExp(pattern);

    – spc16670

    7. Oktober 2016 um 18:35 Uhr

Dafür gibt es eine Standard-Bibliotheksfunktion in der path Modul:

import path from 'path';

console.log(path.extname('abc.txt'));

Ausgabe:

.TXT

Also, wenn Sie nur das Format wollen:

path.extname('abc.txt').slice(1) // 'txt'

Wenn keine Erweiterung vorhanden ist, gibt die Funktion eine leere Zeichenfolge zurück:

path.extname('abc') // ''

Wenn Sie Node verwenden, dann path ist eingebaut. Wenn Sie auf den Browser abzielen, bündelt Webpack a path Umsetzung für Sie. Wenn Sie auf den Browser ohne Webpack abzielen, können Sie ihn einschließen path-browserify manuell.

Es gibt keinen Grund, Strings aufzuteilen oder Regex zu machen.

  • Wer hat etwas über Knoten gesagt?

    – Shannon Hochkins

    11. April 2019 um 5:22 Uhr

  • Ihr Argument dafür, keine Aufteilung oder reguläre Ausdrücke zu verwenden, besteht darin, ein Plugin einzuschließen oder die Anwendung mit einem Knoten zu bündeln. Dies ist eine übertriebene Antwort für eine einfache Aufgabe

    – Shannon Hochkins

    12. April 2019 um 5:47 Uhr

  • @ShannonHochkins Meistens hast du diese Dinge sowieso eingerichtet

    – sdgfsdh

    26. September 2019 um 16:43 Uhr

  • @AndreiDraganescu Ich wollte nicht, dass es herablassend ist, also habe ich es abgeschwächt.

    – sdgfsdh

    13. Januar 2020 um 23:07 Uhr

  • Funktioniert gut. Webpack ist sehr häufig bereits vorhanden, wenn die clientseitige Entwicklung auf Browser abzielt. Das hat sich vor Jahren etabliert. Ein serverseitiger Entwickler, der mit Knoten arbeitet, hat dies bereits integriert. Warum die bereits für Sie erledigte Arbeit duplizieren? Ich würde Webpack nicht nur dafür verwenden, aber wenn Sie es haben, verwenden Sie es.

    – woher kam dieser Name

    22. Dezember 2021 um 22:26 Uhr


916920cookie-checkWie kann ich Dateierweiterungen mit JavaScript erhalten?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy