📚 课程目录第1章修复变量未定义的运行时错误

1. 修复变量未定义的运行时错误

任务说明

本案例提供一个包含变量未定义错误的JavaScript代码片段，该错误会在运行时抛出ReferenceError。你的任务是定位错误根源，修复代码，使其能够正常计算并输出指定结果。

问题代码

function calculateTotal(price, quantity) {
    const discount = 0.9;  // 10% off
    // Bug: 变量名拼写错误，subtotal 被误写为 subTotal
    const subTotal = price * quantity;
    const total = subTotal * discount;
    return total;
}

function showResult() {
    const productPrice = 100;
    const productQuantity = 3;
    const finalPrice = calculateTotal(productPrice, productQuantity);
    // Bug: 变量名不一致，finalPrice 被误写为 finalprice
    console.log("总价: " + finalprice);
}

showResult();

错误分析

运行上述代码时，JavaScript引擎会抛出ReferenceError: finalprice is not defined。这是因为在showResult函数中，变量被声明为finalPrice（驼峰命名），但在console.log中却引用了finalprice（全小写）。JavaScript变量名区分大小写，因此finalprice在作用域中不存在，导致引用错误。

修复方案

将console.log中的变量名从finalprice改为finalPrice，使其与声明保持一致：

function calculateTotal(price, quantity) {
    const discount = 0.9;  // 10% off
    const subTotal = price * quantity;
    const total = subTotal * discount;
    return total;
}

function showResult() {
    const productPrice = 100;
    const productQuantity = 3;
    const finalPrice = calculateTotal(productPrice, productQuantity);
    // 修复：变量名改为 finalPrice，与声明一致
    console.log("总价: " + finalPrice);
}

showResult();

验证方法

将修复后的代码保存为fix-reference-error.js，在Node.js环境中运行：

node fix-reference-error.js

观察控制台输出。修复成功后，应输出：

总价: 270

该结果由代码逻辑直接推出：100 × 3 = 300，300 × 0.9 = 270。若仍出现ReferenceError，请检查所有变量名是否严格一致（包括大小写）。

调试要点

当浏览器或Node.js抛出ReferenceError: xxx is not defined时，错误信息中的变量名即为查找线索。
检查该变量在作用域内是否已用const/let/var声明，并确认引用处的拼写与大小写完全一致。
使用IDE的“查找所有引用”功能可快速定位不一致的引用点。