Viele dieser Tools tun Arbeit direkt mit der abstrakten Syntaxbaum (oder besser gesagt, eine direkte Eins-zu-Eins - Visualisierung davon). Dazu gehören Blockly, die Sie gesehen haben, und die anderen blockbasierten Sprachen und Editoren wie es ( Scratch , Bleistift - Code / Droplet , Snap! , GP , Fliesen- Gnade , und so weiter).
Diese Systeme zeigen aus Gründen, die an anderer Stelle erläutert wurden (Platzbedarf und auch Interaktionsschwierigkeiten), keine herkömmliche Darstellung von Scheitelpunkten und Kanten, sondern stellen direkt einen Baum dar. Ein Knoten oder Block ist ein untergeordnetes Element eines anderen Knotens, wenn er sich direkt physisch im übergeordneten Element befindet.
Ich habe eines dieser Systeme gebaut ( Tiled Grace , Papier , Papier ). Ich kann Ihnen versichern, dass es sehr viel mit dem AST direkt zu tun hat: Was Sie auf dem Bildschirm sehen, ist eine exakte Darstellung des Syntaxbaums als verschachtelte DOM-Elemente (also ein Baum!).
Dies ist der AST eines Codes. Die Wurzel ist ein Methodenaufrufknoten "for ... do". Dieser Knoten hat einige untergeordnete Knoten, beginnend mit "_ .. _", der selbst zwei untergeordnete Knoten hat, einen "1" -Knoten und einen "10" -Knoten. Was auf dem Bildschirm erscheint, ist genau das, was das Compiler-Backend während des Prozesses ausgibt - im Grunde funktioniert das System so.
Wenn Sie möchten, können Sie sich das als ein Standard-Baumlayout vorstellen, bei dem die Kanten aus dem Bildschirm in Ihre Richtung zeigen (und durch den Block vor ihnen verdeckt sind). Verschachtelung ist jedoch eine ebenso gültige Möglichkeit, einen Baum als Scheitelpunkt darzustellen Diagramm.
Es wird auch "die Rundreise von der Quelle zum Knoten-Graphen und dann bei Bedarf wieder zurück zur Quelle" machen. Tatsächlich können Sie das sehen, wenn Sie unten auf "Codeansicht" klicken. Wenn Sie den Text ändern, wird er erneut analysiert und der resultierende Baum zur erneuten Bearbeitung gerendert. Wenn Sie die Blöcke ändern, geschieht dasselbe mit der Quelle.
Pencil Code macht im Wesentlichen dasselbe mit einer besseren Benutzeroberfläche . Die verwendeten Blöcke sind eine grafische Ansicht des CoffeeScript AST. Dies gilt auch für die anderen block- oder fliesenbasierten Systeme im Großen und Ganzen, obwohl einige von ihnen den Verschachtelungsaspekt in der visuellen Darstellung nicht so deutlich machen und viele keine tatsächliche Textsprache hinter sich haben, so dass " "Syntaxbaum" kann ein bisschen illusorisch sein, aber das Prinzip ist da.
Was Sie fehlen, dann ist, dass diese Systeme wirklich sind direkt mit dem abstrakten Syntaxbaum zu arbeiten. Was Sie sehen und manipulieren, ist eine platzsparende Darstellung eines Baums, in vielen Fällen wörtlich der AST, den ein Compiler oder Parser erzeugt.