webpack2源码把JS转成AST

56 阅读2分钟

index.js文件

import { A } from './a.js'	
function test() {	
  const tmp = 'something'	
  return tmp + A	
}	
const r = test()

通过lib\Parser.js把index.js转换成AST树状结构。

{
  type: "Program",
  start: 0,
  end: 106,
  loc: {
    start: {
      line: 1,
      column: 0,
    },
    end: {
      line: 6,
      column: 15,
    },
  },
  range: [
    0,
    106,
  ],
  body: [
    {
      type: "ImportDeclaration",
      start: 0,
      end: 27,
      loc: {
        start: {
          line: 1,
          column: 0,
        },
        end: {
          line: 1,
          column: 27,
        },
      },
      range: [
        0,
        27,
      ],
      specifiers: [
        {
          type: "ImportSpecifier",
          start: 9,
          end: 10,
          loc: {
            start: {
              line: 1,
              column: 9,
            },
            end: {
              line: 1,
              column: 10,
            },
          },
          range: [
            9,
            10,
          ],
          imported: {
            type: "Identifier",
            start: 9,
            end: 10,
            loc: {
              start: {
                line: 1,
                column: 9,
              },
              end: {
                line: 1,
                column: 10,
              },
            },
            range: [
              9,
              10,
            ],
            name: "A",
          },
          local: {
            type: "Identifier",
            start: 9,
            end: 10,
            loc: {
              start: {
                line: 1,
                column: 9,
              },
              end: {
                line: 1,
                column: 10,
              },
            },
            range: [
              9,
              10,
            ],
            name: "A",
          },
        },
      ],
      source: {
        type: "Literal",
        start: 18,
        end: 26,
        loc: {
          start: {
            line: 1,
            column: 18,
          },
          end: {
            line: 1,
            column: 26,
          },
        },
        range: [
          18,
          26,
        ],
        value: "./a.js",
        raw: "'./a.js'",
      },
    },
    {
      type: "FunctionDeclaration",
      start: 28,
      end: 90,
      loc: {
        start: {
          line: 2,
          column: 0,
        },
        end: {
          line: 5,
          column: 1,
        },
      },
      range: [
        28,
        90,
      ],
      id: {
        type: "Identifier",
        start: 37,
        end: 41,
        loc: {
          start: {
            line: 2,
            column: 9,
          },
          end: {
            line: 2,
            column: 13,
          },
        },
        range: [
          37,
          41,
        ],
        name: "test",
      },
      generator: false,
      expression: false,
      async: false,
      params: [
      ],
      body: {
        type: "BlockStatement",
        start: 44,
        end: 90,
        loc: {
          start: {
            line: 2,
            column: 16,
          },
          end: {
            line: 5,
            column: 1,
          },
        },
        range: [
          44,
          90,
        ],
        body: [
          {
            type: "VariableDeclaration",
            start: 48,
            end: 70,
            loc: {
              start: {
                line: 3,
                column: 2,
              },
              end: {
                line: 3,
                column: 24,
              },
            },
            range: [
              48,
              70,
            ],
            declarations: [
              {
                type: "VariableDeclarator",
                start: 52,
                end: 69,
                loc: {
                  start: {
                    line: 3,
                    column: 6,
                  },
                  end: {
                    line: 3,
                    column: 23,
                  },
                },
                range: [
                  52,
                  69,
                ],
                id: {
                  type: "Identifier",
                  start: 52,
                  end: 55,
                  loc: {
                    start: {
                      line: 3,
                      column: 6,
                    },
                    end: {
                      line: 3,
                      column: 9,
                    },
                  },
                  range: [
                    52,
                    55,
                  ],
                  name: "tmp",
                },
                init: {
                  type: "Literal",
                  start: 58,
                  end: 69,
                  loc: {
                    start: {
                      line: 3,
                      column: 12,
                    },
                    end: {
                      line: 3,
                      column: 23,
                    },
                  },
                  range: [
                    58,
                    69,
                  ],
                  value: "something",
                  raw: "'something'",
                },
              },
            ],
            kind: "var",
          },
          {
            type: "ReturnStatement",
            start: 73,
            end: 88,
            loc: {
              start: {
                line: 4,
                column: 2,
              },
              end: {
                line: 4,
                column: 17,
              },
            },
            range: [
              73,
              88,
            ],
            argument: {
              type: "BinaryExpression",
              start: 80,
              end: 87,
              loc: {
                start: {
                  line: 4,
                  column: 9,
                },
                end: {
                  line: 4,
                  column: 16,
                },
              },
              range: [
                80,
                87,
              ],
              left: {
                type: "Identifier",
                start: 80,
                end: 83,
                loc: {
                  start: {
                    line: 4,
                    column: 9,
                  },
                  end: {
                    line: 4,
                    column: 12,
                  },
                },
                range: [
                  80,
                  83,
                ],
                name: "tmp",
              },
              operator: "+",
              right: {
                type: "Identifier",
                start: 86,
                end: 87,
                loc: {
                  start: {
                    line: 4,
                    column: 15,
                  },
                  end: {
                    line: 4,
                    column: 16,
                  },
                },
                range: [
                  86,
                  87,
                ],
                name: "A",
              },
            },
          },
        ],
      },
    },
    {
      type: "VariableDeclaration",
      start: 91,
      end: 106,
      loc: {
        start: {
          line: 6,
          column: 0,
        },
        end: {
          line: 6,
          column: 15,
        },
      },
      range: [
        91,
        106,
      ],
      declarations: [
        {
          type: "VariableDeclarator",
          start: 95,
          end: 105,
          loc: {
            start: {
              line: 6,
              column: 4,
            },
            end: {
              line: 6,
              column: 14,
            },
          },
          range: [
            95,
            105,
          ],
          id: {
            type: "Identifier",
            start: 95,
            end: 96,
            loc: {
              start: {
                line: 6,
                column: 4,
              },
              end: {
                line: 6,
                column: 5,
              },
            },
            range: [
              95,
              96,
            ],
            name: "r",
          },
          init: {
            type: "CallExpression",
            start: 99,
            end: 105,
            loc: {
              start: {
                line: 6,
                column: 8,
              },
              end: {
                line: 6,
                column: 14,
              },
            },
            range: [
              99,
              105,
            ],
            callee: {
              type: "Identifier",
              start: 99,
              end: 103,
              loc: {
                start: {
                  line: 6,
                  column: 8,
                },
                end: {
                  line: 6,
                  column: 12,
                },
              },
              range: [
                99,
                103,
              ],
              name: "test",
            },
            arguments: [
            ],
          },
        },
      ],
      kind: "var",
    },
  ],
  sourceType: "module",
}

树结构如下图所示:

334030079-d9a6ba8c-d769-4875-9a08-ab29b4f9978a.png