abstract-syntax-tree - 如何通过javascript（esprima）将一个节点插入抽象语法树

Question

有一个关于 esprima 和插入 ast 节点的问题。

我尝试生成一个 ast 节点以用新节点 (node = newNode) 替换其他节点，但它不起作用。

    estraverse.traverse(tree, {
enter(node, parent) {
try {
    if (node.type === "ExpressionStatement") {
        if(node.expression.right.type == "FunctionExpression"){
            // the id attribution can be replaced
            node.expression.right.id = node.expression.left;
            // but node can not be replaced
            node = node.expression.right;
            node.type = "FunctionDeclaration";
        }
    }
} catch (error) {

}
},});

Answer 1

根据您共享的代码片段，您正在使用 estraverse 解析 AST。要替换节点，您需要使用 estraverse.replace API。您可以查看 estraverse.replace 文档中的详细信息，但通常当您找到要替换的节点时（例如 if(node=='Expression Statement'){ .... }），您需要返回新节点到这个函数，它将替换当前节点。

//node被Newnode替换

result = estraverse.replace(AST, {
    leave: function (node) {
        if (node.type == 'Expression Statement')
            return Newnode;
    }
});

您需要注意的一点是确保 Newnode 无论如何都不会破坏 AST 语法。我发现的最好方法是通过将代码片段转换为 AST 来获取 Newnode，然后从中获取相应的节点。这可以确保结构保持 ecmascript 兼容。