Javascript 未捕获引用错误:未定义g

Javascript 未捕获引用错误:未定义g,javascript,html,Javascript,Html,好吧,我刚做了一个计算器,在Chrome上测试时,我遇到了这个错误 “未捕获引用错误:未定义g (匿名函数)”。尽管我只是用 function chart(principal, interest, monthly, payments) { var graph = document.getElementById("graph"); graph.width = graph.width; if (arguments.length == 0 || !graph.getConte

好吧,我刚做了一个计算器,在Chrome上测试时,我遇到了这个错误 “未捕获引用错误:未定义g (匿名函数)”。尽管我只是用

function chart(principal, interest, monthly, payments) {
    var graph = document.getElementById("graph");
    graph.width = graph.width;

    if (arguments.length == 0 || !graph.getContext) return;

    var g = graph.getContext("2d"); 
    //g is defined here yet on line 147, i get the          
    //error
    var width = graph.width,
        height = graph.height;

    function paymentToX(n) {
        return n * width / payments;
    }

    function amountToY(a) {
        return height - (a * height / (monthly * payments * 1.05));
    }

    g.moveTo(paymentToX(0), amountToY(0));
    g.lineTo(paymentToX(payments),
    amountToY(monthly * payments));

    g.lineTo(paymentToX(payments), amountToY(0));
    g.closePath();
    g.fillStyle = "#f88";
    g.fill();
    g.font = "bold 12px sans-serif";
    g.fillText("Total Interest Payments", 20, 20);

    var equity = 0;
    g.beginPath();
    g.moveTo(paymentToX(0), amountToY(0));
    for (var p = 1; p <= payments; p++) {
        var thisMonthsInterst = (principal - equity) * interest;
        bal -= (monthly - thisMonthsInterst);
        g.lineTo(paymentToX(p), amountToY(bal));
    }
    g.lineWidth = 3;
    g.stroke();
    g.fillStyle = "black";
    g.fillText("Loan Balance", 20, 20);

    g.textAlign = "center";
    var y = amountToY(0);
    var x = paymentToX(year * 12);
    g.fillRect(x - 0.5, y - 3, 1, 3);
    if (year == 1) g.fillText("Year", x, y - 5);
    if (year % 5 == 0 && year * 12 !== payments) g.fillText(String(year), x, y - 5);
 }
g.lineWidth = 3;
g.stroke();
g.fillStyle = "black";
g.fillText("Loan Balance", 20, 20);

g.textAlign = "center";
var y = amountToY(0);
var x = paymentToX(year * 12);
g.fillRect(x - 0.5, y - 3, 1, 3);
if (year == 1) g.fillText("Year", x, y - 5);
if (year % 5 == 0 && year * 12 !== payments) g.fillText(String(year), x, y - 5);
 g.textAlign = "right";
  g.textBaseline = "middle";
}
功能图(本金、利息、每月、付款){
var-graph=document.getElementById(“图”);
graph.width=graph.width;
if(arguments.length==0 | |!graph.getContext)返回;
var g=graph.getContext(“2d”);
//这里定义了g,但在第147行,我得到了
//错误
变量宽度=图形宽度,
高度=图形高度;
函数paymentToX(n){
返回n*宽度/付款;
}
功能数量玩具(a){
返回高度-(a*高度/(每月*付款*1.05));
}
g、 移动到(paymentToX(0),amountToY(0));
g、 lineTo(付款)Tox(付款),
金额(每月*付款);
g、 lineTo(paymentToX(付款),amountToY(0));
g、 closePath();
g、 fillStyle=“#f88”;
g、 填充();
g、 font=“bold 12px无衬线”;
g、 fillText(“利息支付总额”,20,20);
var权益=0;
g、 beginPath();
g、 移动到(paymentToX(0),amountToY(0));

对于(var p=1;pg.textAlign和g.textBaseline不在您定义g的函数范围内函数
图表
g.lineWidth=3
之前结束。超出这一点的所有内容都没有
g

@ArtOfCode的定义我猜在这个函数范围之外您注意到格式化后的语法问题了吗代码?最后一行是147,@ArtOfcomove函数中的最后2行function
paymentToX
amountToY
应该在
chart
之外。然后在函数之外定义
var g
。是否有一个全局变量可以在整个脚本中使用?@user3788077您应该避免全局变量。存在almos使用它们从来不是一个好的理由。你的用例是什么?也许我们可以想出如何在不使用全局函数的情况下解决问题。也就是说,为什么你不能将这两行代码塞进函数中?@user3788077将所有内容包装在一个iife中,然后在iife的最上面声明
g
。其他所有内容都在这个函数声明下面。这不会污染全局空间,甚至在图表函数外部也允许访问
g
变量。它在函数内部,您看到的括号用于for循环。后面还有另一个括号。@user3788077循环块以前关闭过(在
for(var p=1;p)之后的4行