const parse = require('@babel/parser').parse; const generate = require('@babel/generator').default; const ast = parse('const a = 111'); traverse(ast, { VariableDeclaration: function (path) { //识别在变量声明的时候 if (path.node.kind === 'const') { //只有const的时候才处理 console.log(path.node) path.replaceWith( t.VariableDeclaration('var', // var | let | const [ t.VariableDeclarator( t.Identifier("b"), // 变量名 t.numericLiteral(999) // 变量的值 ) ]) ); } path.skip(); } }); let code = generate(ast).code; console.log(code)
这段代码演示了如何用Babel把const a = 111里面的几个要素逐一替换。把const替换成var,变量名称a替换成b,111替换成999。
在 babel/types 的源码里 lib/definitions/core.js有相关的定义。从下面的代码可以发现VariableDeclaration分成两部分kind和VariableDeclarator。其中kind只能是var,let和const这3个字符串。declarations是一个数组,数组的每个元素都是VariableDeclarator。
defineType("VariableDeclaration", { builder: ["kind", "declarations"], visitor: ["declarations"], aliases: ["Statement", "Declaration"], fields: { declare: { validate: assertValueType("boolean"), optional: true, }, kind: { validate: chain( assertValueType("string"), assertOneOf("var", "let", "const"), ), }, declarations: { validate: chain( assertValueType("array"), assertEach(assertNodeType("VariableDeclarator")), ), }, }, });
VariableDeclarator的定义在下面的代码里有。分成两部分id和init。id就是变量的名称。init对应一个表达式。
defineType("VariableDeclarator", { visitor: ["id", "init"], fields: { id: { validate: assertNodeType("LVal"), }, definite: { optional: true, validate: assertValueType("boolean"), }, init: { optional: true, validate: assertNodeType("Expression"), }, }, });
在babel里可以这样组装这个VariableDeclarator。id对应t.Identifier("b"),init对应t.numericLiteral(999)
t.VariableDeclarator( t.Identifier("b"), // 变量名 t.numericLiteral(999) // 变量的值 )