Вопрос или проблема
Я пытаюсь настроить скрипт для расчета ежемесячного платежа по кредиту, но с условием, что если срок кредита меньше 4 месяцев, проценты не начисляются. Но в строке 25 у меня возникает ошибка monthcredit не определен, как я могу это исправить? Результат отображается по ссылкам #msum и #ovsum. Конструктор сайтов Tilda.
Плохой код –
<!-- Как сделать калькулятор расчета аннуитетных платежей по кредиту в ZeroBlock в Tilda mo-ti.ru --><script src="https://static.tildacdn.com/js/jquery-1.10.2.min.js" charset="utf-8" onerror="this.loaderr="y";"></script>
<style>
a[href="#msum"] , a[href="#ovsum"] {pointer-events:none;}
</style>
<script>
$( document ).ready(function() {
//Значение процента
var percent = 10;
$(".tn-atom__form").on('input', ".t-range", function() {
setTimeout(function(){
let summa = $('input[name="summa"]').next('.t-range__value-txt').html();
let srok = $('input[name="srok"]').next('.t-range__value-txt').html();
let monthPercent = percent/100/12;
//Возведение в степень
let degree = Math.pow( 1+monthPercent , -srok);
if (srok <= 4) {
let monthCredit = summa/srok;
let overCredit =0
} else {
let monthCredit = summa*(monthPercent/(1-degree));
let overCredit = monthCredit*srok-summa
}
//Выводим итоги в текст
monthCredit = monthCredit.toFixed();
overCredit = overCredit.toFixed();
monthCredit = monthCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
overCredit = overCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
$('a[href="#msum"]').html(monthCredit+' руб.');
$('a[href="#ovsum"]').html(overCredit+' руб.');
}, 100);
});
});
</script>
У меня есть тот же работающий скрипт, но он не предусматривает условие про 4 месяца (прилагается ниже) –
Рабочий код –
<!-- Как сделать калькулятор расчета аннуитетных платежей по кредиту в ZeroBlock в Tilda mo-ti.ru --><script src="https://static.tildacdn.com/js/jquery-1.10.2.min.js" charset="utf-8" onerror="this.loaderr="y";"></script>
<style>
a[href="#msum"] , a[href="#ovsum"] {pointer-events:none;}
</style>
<script>
$( document ).ready(function() {
//Значение процента
var percent = 10;
$(".tn-atom__form").on('input', ".t-range", function() {
setTimeout(function(){
let summa = $('input[name="summa"]').next('.t-range__value-txt').html();
let srok = $('input[name="srok"]').next('.t-range__value-txt').html();
let monthPercent = percent/100/12;
//Возведение в степень
let degree = Math.pow( 1+monthPercent , -srok);
let monthCredit = summa*(monthPercent/(1-degree));
let overCredit = monthCredit*srok-summa
//Выводим итоги в текст
monthCredit = monthCredit.toFixed();
overCredit = overCredit.toFixed();
monthCredit = monthCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
overCredit = overCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
$('a[href="#msum"]').html(monthCredit+' руб.');
$('a[href="#ovsum"]').html(overCredit+' руб.');
}, 100);
});
});
</script>.
Идентификатор monthCredit объявляется только в области видимости одного из ветвлений логики if (srok <= 4), поэтому он не объявлен в следующей более высокой области видимости, где остальная часть функции пытается использовать/ссылаться на него.
Переместите объявление monthCredit за пределы ветвлений if. То же самое для overCredit.
Пример:
$(document).ready(function() {
var percent = 10;
$(".tn-atom__form").on('input', ".t-range", function() {
setTimeout(function() {
let summa = $('input[name="summa"]').next('.t-range__value-txt').html();
let srok = $('input[name="srok"]').next('.t-range__value-txt').html();
let monthPercent = percent / 100 / 12;
let degree = Math.pow(1 + monthPercent, -srok);
// Объявлено в этой области видимости
let monthCredit = 0;
let overCredit = 0;
if (srok <= 4) {
monthCredit = summa / srok;
overCredit = 0;
} else {
monthCredit = summa * (monthPercent / (1 - degree));
overCredit = monthCredit * srok - summa;
}
monthCredit = monthCredit.toFixed();
overCredit = overCredit.toFixed();
monthCredit = monthCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
overCredit = overCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
$('a[href="#msum"]').html(monthCredit + ' руб.');
$('a[href="#ovsum"]').html(overCredit + ' руб.');
}, 100);
});
});
</script>
.
Ответ или решение
Решение проблемы "переменная monthCredit не определена" в скрипте калькулятора кредита
При разработке скрипта для расчёта ежемесячных платежей по кредиту, важно учитывать все возможные сценарии выполнения кода, чтобы избежать ошибок, подобных той, с которой вы столкнулись: "monthCredit не определена". Эта ошибка возникает, когда переменная используется вне своего контекста, что и случилось в вашем коде.
Проблема
В вашем коде переменные monthCredit и overCredit объявлены внутри условных операторов (if-else). Это означает, что если условие не выполнено или не достигнуто, JavaScript не знает, что такое monthCredit и overCredit, что приводит к ошибке.
Решение
Чтобы избежать этой ошибки, необходимо объявить переменные monthCredit и overCredit вне условных операторов, присвоив им начальные значения. Тогда, вне зависимости от ветки выполнения, код сможет ссылаться на эти переменные.
Исправленный код
Вот как можно переписать ваш скрипт с учетом этой рекомендации:
$(document).ready(function() {
// Установка годовой процентной ставки
var percent = 10;
$(".tn-atom__form").on('input', ".t-range", function() {
setTimeout(function() {
// Получение значений суммы и срока
let summa = $('input[name="summa"]').next('.t-range__value-txt').html();
let srok = $('input[name="srok"]').next('.t-range__value-txt').html();
let monthPercent = percent / 100 / 12;
// Возведение в степень
let degree = Math.pow(1 + monthPercent, -srok);
// Объявление переменных в локальной области видимости
let monthCredit = 0;
let overCredit = 0;
// Условие для расчёта
if (srok <= 4) {
monthCredit = summa / srok; // Для сроков до 4 месяцев
overCredit = 0; // Переплата отсутствует
} else {
monthCredit = summa * (monthPercent / (1 - degree)); // Формула для расчета платежа
overCredit = monthCredit * srok - summa; // Расчет переплаты
}
// Форматирование результата
monthCredit = monthCredit.toFixed();
overCredit = overCredit.toFixed();
monthCredit = monthCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
overCredit = overCredit.replace(/(\d)(?=(\d\d\d)+([^\d]|$))/g, '$1 ');
// Отображение результатов
$('a[href="#msum"]').html(monthCredit + ' руб.');
$('a[href="#ovsum"]').html(overCredit + ' руб.');
}, 100);
});
});Ключевые изменения
- Объявление переменных: Переменные
monthCreditиoverCreditтеперь объявляются в начале функции с начальным значением 0, что позволяет использовать их за пределами условных блоков. - Форматирование и вывод: После расчёта результаты форматируются и отображаются в соответствии с установленным стилем.
Вывод
Следуя данным рекомендациям, вы сможете избежать ошибок, связанных с областью видимости переменных в JavaScript. Кроме того, написание читаемого и структурированного кода поможет вам в будущем легко вносить изменения и адаптировать его под новые требования. Не забудьте протестировать исправленный код в различных сценариях, чтобы убедиться в его корректности и надёжности.