Texteditor mit einem Codebaum-Panel

Meine JavaScript-Datei enthält etwa 10 bis 20 Funktionen. Ich verwende Notepad++ und kann den Code in diese Funktionen falten. Aber ich brauche eine zusätzliche Registerkarte (oder ein Feld oder ein Fenster) im selben Fenster, das ich bearbeite, wo ich eine Liste (oder einen Baum) mit all diesen Funktionen sehen kann. So kann ich auf eine beliebige Funktion klicken und dann mit dem Cursor auf die Funktion springen, auf die ich geklickt habe.

Das Funktionslisten-/Baumfenster sollte ähnlich aussehen wie die Dateiliste im Atom-Editor (diese Registerkarte befindet sich links vom Bearbeitungsbereich).

Ich weiß nicht, ob Notepad ++ eine solche Funktion hat, aber vielleicht gibt es einen Editor, der das kann?

Später bearbeiten: Ich habe den Titel der Frage geändert. Ich wusste nicht, dass es "Code Tree Panel" heißt

Einige Leute denken, wenn sie mit dem Programmieren konfrontiert werden: "Ich weiß, ich werde Notepadd++ verwenden." Jetzt haben sie zwei Probleme. ( Entschuldigung - ich konnte nicht widerstehen. Ich liebe Notepad ++ und benutze es täglich, aber zu Hause und auf der Arbeit - für Text . Verwenden Sie für Code eine IDE. Sie erhalten Refactoring, springen zu Funktion/Variablendeklaration/Verwendung, Codevervollständigung , Dokumentation von Systemfunktionen und vor allem einen Debugger. Wenn Sie keinen haben oder nicht wissen, wie man einen benutzt, hören Sie jetzt auf zu programmieren und lernen Sie. Sie sparen viel Zeit.
Eine IDE ist sogar noch wichtiger für eine interpretierte Sprache wie JS, da die meisten guten IDEs einen Linter haben . Notepad++ ist ausgezeichnet, aber es wird Ihnen nicht sagen, wenn Sie einen Variablennamen falsch schreiben oder schlimmeres.
Obwohl Sie mit einer guten IDE Code falten können , mache ich mir nie die Mühe. Was ist der Punkt? Es wird im Allgemeinen nur verwendet, um die Navigation durch Ihren Code zu erleichtern. Mit einer guten IDE kann ich leicht eine Liste von Funktionen in einer bestimmten Datei abrufen, klicken und zu einer springen. Ich kann sehen, dass mein Code auf eine Variable oder Funktion zugreift und zu ihrer Deklaration oder allen Verwendungen davon springen. Warum sollte ich Code falten wollen?
@Mawg Jeder Texteditor, der die Syntaxfärbung für eine Sprache unterstützt, sollte in der Lage sein, einen Linter für diese Sprache zu haben. Atom und VSCode und wahrscheinlich viele andere haben js-Linters.
Das sind IDEs. Notepad++ ist keine IDE und unterstützt, AFAIK, einen Linter. Das wichtigste Pint ist jedoch der Debugger. Keine Funktion ist wichtiger als ein Debugger

Antworten (2)

Der CudaText- Editor (leicht und kostenlos) verfügt über ein Codebaum-Bedienfeld mit Funktionsliste. Umgeschaltet mit F12. Unterstützt für viele Syntaxen, auch JavaScript.

CudaText JS-Baum

Danke, es funktioniert und es ist viel leichter als Visual Studio Code.

Neuere Versionen von VS Code haben eine "Code Gliederungsansicht".

Die Funktionsnamen in diesem Bereich (siehe Screenshot unten links) sind anklickbar und werden zur Funktionsdefinition in der JS-Datei verschoben.

Geben Sie hier die Bildbeschreibung ein

Texteditor mit einem Codebaum-Panel
AntwortenHierDatenschutz-Bestimmungen1y, 0v