基于 Antlr4 事件的访客 (javascript)

Antlr4 event based Visitor (javascript)

我正在尝试用 antlr4 编写我自己的语言。我设法创建了自己的语法并创建了自己的 Visitor 来编译我的语言。

现在,我正在尝试为我的语言构建简单的 GUI 界面。但是,我对如何去做,或者是否可能做到这一点感到很困惑。 情况是这样的。

我的语言支持简单的函数声明。假设我的 html 页面上有简单的文本区域,它加载了我的代码构建解析器和常用的 antlr 内容。在此之后我打电话给访客 运行 我的代码。

    var chars = new antlr4.InputStream(inputText);
    var lexer = new TinyLexer(chars);
    var tokens = new antlr4.CommonTokenStream(lexer);
    var parser = new TinyParser(tokens);
    parser.buildParseTrees = true;
    var tree = parser.parse();
    var visitor = new Visitor();
    visitor.visit(tree);

我的语言:

def rock()
 println("You selected ROCK")
end

rock()

这是有效的并将消息打印到我的输出 windows。但是现在我添加了对我的语言的按钮的支持,这些按钮可以在点击时调用一些功能。 这将创建简单的 html 按钮,它应该在点击时调用函数 rock():

Button btn1("MyButton", "rock()")

访问newButtonCall时我的想法是这样的

Visitor.prototype.visitNewButtonCall = function (ctx) {
    var buttonId = ctx.Identifier().getText();
    var buttonName = this.visit(ctx.exprList().expression(0));
    var buttonFunction = this.visit(ctx.exprList().expression(1));

    var button = document.createElement('button');
    button.onclick = function(){
            if(buttonFunction in this.myFunctions){
                return this.myFunctions[buttonFunction].invoke();
            }
        };
};

当然,这不能工作,因为访问者完成了它的工作,它不再保留任何参考,所以 this.myFunctions 不再存在。 但是我不知道如何使它工作(除了再次调用整个访问者进程)。

有什么帮助吗?非常感谢!

Of course, this cant work cause visitor finished its job and it is no more keeping reference about anything so this.myFunctions doesnt exist anymore

这不是它不起作用的原因。函数可以从其周围范围访问对象,并且这些对象将与函数一样存在。

您的代码不起作用,因为 onclick 将在按钮上调用,因此 this 将成为按钮,而不是您的访问者。您可以将 this 分配给一个变量,同时它仍然引用访问者(即在 onclick 函数之外),然后使用该变量而不是 this:

var visitor = this;
button.onclick = function(){
    if(buttonFunction in visitor.myFunctions){
        return visitor.myFunctions[buttonFunction].invoke();
    }
};

PS:关于术语的注释:你写的不是编译器。编译器生成另一种语言的代码(通常是机器 code/assembly,但在网络上下文中,语言也经常被编译为 JavaScript(或非 GCed 语言的网络汇编)。您的访问者直接执行代码,使其成为解释器。