【vue】vue 是怎么把 template 模版编译成 render 函数的，什么是AST抽象语法树

什么是AST 抽象语法树

1. 是一个对象/或者json
2. 是一个数据结构

3. AST通常是由多个节点组成的树状结构，每个节点代表一个语法单位或表达式。节点之间的关系通过父子关系或兄弟关系来表示程序的结构。在不同的编程语言和工具中，AST可能有不同的表示方式和节点类型。

4. const ast = {
     type: "Program",
     body: [
       {
         type: "FunctionDeclaration",
         id: {
           type: "Identifier",
           name: "add"
         },
         params: [
           {
             type: "Identifier",
             name: "a"
           },
           {
             type: "Identifier",
             name: "b"
           }
         ],
         body: {
           type: "BlockStatement",
           body: [
             {
               type: "ReturnStatement",
               argument: {
                 type: "BinaryExpression",
                 operator: "+",
                 left: {
                   type: "Identifier",
                   name: "a"
                 },
                 right: {
                   type: "Identifier",
                   name: "b"
                 }
               }
             }
           ]
         }
       },
       {
         type: "VariableDeclaration",
         declarations: [
           {
             type: "VariableDeclarator",
             id: {
               type: "Identifier",
               name: "result"
             },
             init: {
               type: "CallExpression",
               callee: {
                 type: "Identifier",
                 name: "add"
               },
               arguments: [
                 {
                   type: "Literal",
                   value: 2
                 },
                 {
                   type: "Literal",
                   value: 3
                 }
               ]
             }
           }
         ],
         kind: "let"
       },
       {
         type: "ExpressionStatement",
         expression: {
           type: "CallExpression",
           callee: {
             type: "MemberExpression",
             object: {
               type: "Identifier",
               name: "console"
             },
             property: {
               type: "Identifier",
               name: "log"
             },
             computed: false
           },
           arguments: [
             {
               type: "Identifier",
               name: "result"
             }
           ]
         }
       }
     ],
     sourceType: "script"
   };
   
   console.log(ast);
   

vue 是怎么把 template 模版编译成 render 函数的