正则表达式实现对象转数组：多行对象未替换问题求助

问题分析 #

你的代码处理多行对象时存在两个核心问题：

1. 多行匹配正则缺少全局标志g，只会替换第一个匹配到的多行对象
2. 多行匹配正则(\{\s*\n(?:\s*\w+\s*:\s*.+,?\n)+\s*\})逻辑有局限：
   • .默认不匹配换行符，无法适配属性值含换行的场景（即使示例中没有，也不够健壮）
   • 强制要求最后一个属性行带逗号和换行，无法匹配无尾部逗号的多行对象

此外fixJSON函数的尾部逗号处理也不彻底，多行场景下的冗余逗号无法完全清除。

修复后的完整代码 #

JavaScript #

const txtara = document.querySelector('#demo');

const fixJSON = (invalidJson) => invalidJson
  .replace(/(\w+)(?=\s*:)/g, '"$1"') // 为属性名添加引号
  .replace(/,\s*([}\]])/g, '$1');    // 移除所有紧接在}或]前的多余逗号（兼容单行/多行）

const jsonObjectToArray = (jsonObject) => {
  try {
    const obj = JSON.parse(fixJSON(jsonObject));
    return JSON.stringify(Object.values(obj));
  } catch (e) {
    console.error('解析失败:', jsonObject, e);
    return jsonObject; // 解析失败时保留原内容，避免破坏文本结构
  }
}

// 单个正则匹配所有对象（单行+多行），全局匹配且支持换行
const objectRegex = /(\{[\s\S]*?\})/g;
let content = txtara.value.replace(objectRegex, (match) => jsonObjectToArray(match));

txtara.value = content;

CSS（无修改） #

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

body {
  display: flex;
}

#demo {
  flex: 1;
  resize: none;
  color: #EEE;
  background: #222;
  padding: 0.5rem;
}

HTML（无修改） #

<textarea id="demo">
{x:1,y:2}
{x:1,y:2,z:3}
{x:1,y:2,z:3,}
{ x: 1, y: 2, z: 3 }
{
  x: 1,
  y: 2,
}
{
  x: 1,
  y: 2
}
{
  x: 1,
  y: 2,
  z: 3
}
{
  x: 1,
  y: 2,
  z: 3,
}
</textarea>

关键改进说明 #

• 统一正则匹配：用/(\{[\s\S]*?\})/g替代分开的单行/多行正则，[\s\S]匹配任意字符（含换行），*?非贪婪匹配避免误抓多个连续对象，g实现全局替换
• 增强JSON修复：/,\s*([}\]])/g一次性处理所有场景下的尾部逗号，不管逗号和闭合符号之间有多少空格或换行
• 错误容错：添加try-catch块，单个对象解析失败时不会中断整个处理流程，同时输出错误信息便于调试

内容的提问来源于stack exchange，提问作者Mr. Polywhirl