答案：编译器分词法分析、语法分析和代码生成三步，将表达式语言转为javascript。首先 tokenize 函数拆分源码为 number、identifier 等 token；接着 parse 构建 ast，识别 numberliteral、identifier 和 binaryexpression 节点，递归处理括号与运算符；最后 generate 遍历 ast，生成带括号的 javascript 表达式字符串。三步串联实现 compile，如输入 "(x + 5) y - 3" 输出 "((((x + 5)) y) - 3)"，语义正确可执行，展示了编译器核心流程。
实现一个简单的编译器，将某种语言子集转换为 JavaScript，主要分为三个阶段：词法分析、语法分析和代码生成。下面以一个极简表达式语言为例（支持加减乘除和变量），说明如何用 JavaScript 实现。
1. 定义源语言子集
假设我们要支持的语法如下：- 数字：如 123、45.6
- 变量名：如 x、count
- 二元运算：+、-、*、/
- 支持括号分组
(x + 5) * y - 3
目标是将其编译成等价的 JavaScript 表达式字符串。
2. 词法分析（Lexer）
将源代码字符串拆分成“词法单元”（tokens）。每个 token 包含类型（type）和值（value）。
立即学习“Java免费学习笔记（深入）”；
function tokenize(input) {
const tokens = [];
let i = 0;
while (i < input.length) {
let char = input[i];
if (char === ' ') {
i++;
continue;
}
if (/[0-9]/.test(char)) {
let value = '';
while (i < input.length && /[0-9\.]/.test(input[i])) {
value += input[i++];
}
tokens.push({ type: 'number', value });
continue;
}
if (/[a-z]/i.test(char)) {
let value = '';
while (i < input.length && /[a-z_]/i.test(input[i])) {
value += input[i++];
}
tokens.push({ type: 'identifier', value });
continue;
}
if (char === '+') {
tokens.push({ type: 'plus', value: '+' });
i++;
continue;
}
if (char === '-') {
tokens.push({ type: 'minus', value: '-' });
i++;
continue;
}
if (char === '*') {
tokens.push({ type: 'asterisk', value: '*' });
i++;
continue;
}
if (char === '/') {
tokens.push({ type: 'slash', value: '/' });
i++;
continue;
}
if (char === '(') {
tokens.push({ type: 'paren', value: '(' });
i++;
continue;
}
if (char === ')') {
tokens.push({ type: 'paren', value: ')' });
i++;
continue;
}
throw new Error('未知字符: ' + char);
}
return tokens;
}3. 语法分析（Parser）
将 tokens 转换成抽象语法树（AST）。我们定义 AST 节点类型：
- NumberLiteral：表示数字
- Identifier：表示变量
- BinaryExpression：表示二元操作（如加法）
function parse(tokens) {
let current = 0;
function walk() {
let token = tokens[current];
if (token.type === 'number') {
current++;
return {
type: 'NumberLiteral',
value: token.value,
};
}
if (token.type === 'identifier') {
current++;
return {
type: 'Identifier',
name: token.value,
};
}
if (token.type === 'paren' && token.value === '(') {
current++; // 跳过 '('
let expr = walk();
token = tokens[current];
if (token.type === 'paren' && token.value === ')') {
current++;
} else {
throw new Error('缺少右括号');
}
return expr;
}
// 处理二元表达式，简单左递归处理
let left = walk();
token = tokens[current];
if (token && ['plus', 'minus', 'asterisk', 'slash'].includes(token.type)) {
current++;
let operator = token.value;
let right = walk();
return {
type: 'BinaryExpression',
operator,
left,
right,
};
}
return left;
}
const ast = {
type: 'Program',
body: walk(),
};
return ast;
}4. 代码生成（Code Generator）
遍历 AST，生成对应的 JavaScript 代码字符串。function generate(ast) {
if (ast.type === 'NumberLiteral') {
return ast.value;
}
if (ast.type === 'Identifier') {
return ast.name;
}
if (ast.type === 'BinaryExpression') {
return `(${generate(ast.left)} ${ast.operator} ${generate(ast.right)})`;
}
if (ast.type === 'Program') {
return generate(ast.body);
}
throw new Error('不支持的节点类型: ' + ast.type);
}5. 组装编译器
把三步串起来：function compile(input) {
const tokens = tokenize(input);
const ast = parse(tokens);
const output = generate(ast);
return output;
}测试一下：
console.log(compile("(x + 5) * y - 3"));
// 输出: ((((x + 5)) * y) - 3)虽然输出多了些括号，但语义正确，可被 JS 正确执行。
基本上就这些。这个例子展示了编译器的核心流程。实际中可以扩展支持函数调用、赋值、控制流等，也可以加入作用域分析、类型检查等优化步骤。关键是理解“分阶段处理”这一思想。
