Неперехваченная ошибка ссылки: 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.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 amp;amp; 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 amp;amp; year * 12 !== payments) g.fillText(String(year), x, y - 5);
 g.textAlign = "right";
  g.textBaseline = "middle";
}

даже после его изменения у меня все еще была та же ошибка.

1. @ArtOfCode Я предполагаю, что за пределами этой функции

2. Замечаете ли вы проблемы с синтаксисом после форматирования кода?

3. последняя строка равна 147, @ArtOfCode

4. переместить последние 2 строки внутри функции

5. функция paymentToX и amountToY должна быть вне chart . Затем определите var g вне функции.

Ответ №1:

g.TextAlign и g.textBaseline находятся за пределами функции, в которой вы определили g

1. Существует ли глобальная переменная, которую можно использовать для всего скрипта?

2. @user3788077 Вам следует избегать глобальных переменных. Почти никогда нет веской причины для их использования. Каков ваш вариант использования? Может быть, мы сможем выяснить, как решить проблему без использования глобального. Т.Е. Почему вы не можете вставить эти две строки в функцию?

3. @user3788077 оберните все внутри iife, а затем объявите g в самом верху внутри iife.. все остальное идет ниже этого объявления функции. Это не приведет к загрязнению глобального пространства и разрешит доступ к g переменной даже вне функции диаграммы.

4. Он находится внутри функции, скобка, которую вы видите там, предназначена для цикла for . После этого появляется еще одна скобка.

5. @user3788077 блок цикла закрыт ранее (4 строки после for (var p = 1; p <= payments; p ) { …

Ответ №2:

Функция chart завершается раньше g.lineWidth = 3 . Все, что находится за пределами этой точки, не имеет определения g .