本文介绍如何修改现有词法分析与转换逻辑，使自定义语言到 JavaScript 的转换器支持真正的多行输入（如换行符 \n），并通过 <textarea> 获取用户输入、逐行处理并正确保留结构。
本文介绍如何修改现有词法分析与转换逻辑，使自定义语言到 javascript 的转换器支持真正的多行输入（如换行符 `\n`），并通过 `
当前代码的核心限制在于：convert() 函数直接将整个输入字符串（含换行符）传入 lexer()，而 lexer() 仅按双引号分割，未考虑语句边界，导致跨行解析错乱；同时 out() 函数对所有 token 统一处理，无法区分不同语句的上下文。要支持多行输入，关键在于 按行切分 → 每行独立词法分析 → 每行独立转换 → 合并输出。
✅ 正确的多行处理流程
- 使用 <textarea> 替代 <input type="text">：确保 HTML 中使用 <textarea id="sparkText"></textarea>，它天然支持换行输入（\n 或 \r\n）；
- 预处理输入：按行分割：用正则 /\r?\n/ 兼容 Windows 和 Unix 换行符；
- 逐行调用 lexer() + out()：每行作为独立语句处理，避免引号跨行干扰；
- 拼接结果时保留换行：每行转换后追加 \n，维持可读性与语法正确性。
以下是重构后的完整核心函数：
function lexer(code) {
const regex = /"(.*?)"/g;
return code.split(regex);
}
function parse(input) {
// 注意：此处仅做简单字符串替换，不处理嵌套或转义；生产环境建议用 AST
return input
.replace(/new/g, "let")
.replace(/is/g, "=")
.replace(/say/g, "console.log")
.replace(/shout/g, "alert");
}
function out(arr) {
let code = "";
for (let i = 0; i < arr.length; i++) {
if (i % 2 === 0) {
code += parse(arr[i]);
} else {
code += `"${parse(arr[i])}"`;
}
}
return code;
}
function convert(input) {
// 关键：先按行分割，再逐行处理
const lines = input.split(/\r?\n/).filter(line => line.trim() !== ""); // 跳过空行
return lines.map(line => out(lexer(line))).join("\n");
}
// 前端绑定示例
function update() {
const input = document.getElementById("sparkText").value;
const jsCode = convert(input);
document.getElementById("jsText").textContent = jsCode; // 使用 textContent 更安全
}⚠️ 注意事项与改进建议
- 安全性：当前 parse() 使用 .replace() 易受子串误匹配影响（例如 "new" 出现在变量名中会被错误替换）。推荐后续升级为基于正则单词边界的替换，如 input.replace(/\bnew\b/g, "let")；
- 引号处理缺陷：现有 lexer() 依赖非贪婪 "(.*?)"，但无法处理转义引号（如 "he said \"hi\""）或单引号字符串。如需健壮性，应实现状态机式 lexer；
- HTML 输出风险：原代码用 innerHTML 插入 JS 代码，存在 XSS 风险。应改用 textContent（如上所示）；
- 空行与空白处理：filter(line => line.trim() !== "") 可跳过纯空白行，提升输出整洁度；
- 调试提示：可在 update() 中添加 console.log({ input, jsCode }) 便于追踪每步结果。
最终效果示例：
输入（多行）：
new dog is "dog" new cat is "cat" say "hello world"
输出：
let dog = "dog" let cat = "cat" console.log "hello world"
该方案保持原有设计简洁性，同时赋予转换器真正的多行能力——无需重写核心逻辑，只需在顶层增加“按行调度”即可稳健扩展。
立即学习“Java免费学习笔记（深入）”；
