如何从JavaScript的eval函数中获取错误信息

直接利用JavaScript捕获到的Error对象自带属性即可获取错误详情，修改后的代码如下：

修改后的JavaScript代码 #

document.getElementById('execute').onclick = function() {
  try {
    eval(document.getElementById('box').value);
    document.getElementById('box2').value = "success";
  } catch (error) {
    // 拼接错误描述与行号
    const errorMsg = `${error.message}，第${error.lineNumber || '未知'}行出错`;
    document.getElementById('box2').value = errorMsg;
    // 若需要完整调用栈，可替换为以下代码
    // document.getElementById('box2').value = error.stack;
  }
}
const canvas = document.querySelector('#canvas');

对应HTML代码（无需修改） #

<div>
  <textarea id="box" rows="10" placeholder="Enter Your Code Here:" cols="65"></textarea>
  <textarea id="box2" rows="10" cols="65" placeholder="Results Shown Here"></textarea>

  <br>
  <canvas id="canvas" height="500" width="500"> </canvas>
  <br>
  <br>
  <button style="width: 2cm;height: 1cm;" id="execute">Execute</button>
</div>

关键说明 #

• Error对象的message属性直接提供错误具体描述，比如输入s = p时会返回p is not defined
• lineNumber属性返回错误发生的行号，若部分环境不支持该属性，可解析error.stack提取完整调用栈中的行号信息
• 测试场景：输入s = 5时box2显示success；输入s = p时显示p is not defined，第1行出错

内容的提问来源于stack exchange，提问作者Craig Sapp