// Convert interest from a percentage to a decimal, and convert from
// an annual rate to a monthly rate. Convert payment period in years
// to the number of monthly payments.
//将利息从一个百分比转换为小数形式(十进制),并从年利率转换为每月利率.将支付期限转换为每月支付
var principal = parseFloat(amount.value); //parseFloat()
parseFloat() 函数可解析一个字符串,并返回一个浮点数。
该函数指定字符串中的首个字符是否是数字。如果是,则对字符串进行解析,直到到达数字的末端为止,然后以数字返回该数字,而不是作为字符串。
语法
parseFloat(string)
注意: 字符串中只返回第一个数字。
注意: 开头和结尾的空格是允许的。
注意: 如果字符串的第一个字符不能被转换为数字,那么 parseFloat() 会返回 NaN。
var interest = parseFloat(apr.value) / 100 / 12;
var payments = parseFloat(years.value) * 12;
// Now compute the monthly payment figure.
var x = Math.pow(1 + interest, payments); // Math.pow() computes powers
相当于:(1 + interest)^{payments}
//测试 md 语法(1 + interest) payments
Math.pow(x,y) //注意大小写
pow() 方法返回 x 的 y 次幂。
var monthly = (principal*x*interest)/(x-1);
// If the result is a finite有限 number, the user's input was good and
// we have meaningful results to display
isFinite() 函数用于检查其参数是否是无穷大。
如果 number 是有限数字(或可转换为有限数字),那么返回 true。否则,如果 number 是 NaN(非数字),或者是正、负无穷大的数,则返回 false。
if (isFinite(monthly)) {
// Fill in the output fields, rounding to 2 decimal places
payment.innerHTML = monthly.toFixed(2);
total.innerHTML = (monthly * payments).toFixed(2);
totalinterest.innerHTML = ((monthly*payments)-principal).toFixed(2);
toFixed()
把数字转换为字符串,结果的小数点后有指定位数的数字( 四舍五入)
// Save the user's input so we can restore it the next time they visit
save(amount.value, apr.value, years.value, zipcode.value);
// Advertise: find and display local lenders, but ignore network errors
try { // Catch any errors that occur within these curly braces 对花括号内的错误进行捕获
getLenders(amount.value, apr.value, years.value, zipcode.value); //这个函数应该是自定义的用来计算的
}
catch(e) { /* And ignore those errors */ }
// Finally, chart loan balance, and interest and equity payments
chart(principal, interest, monthly, payments); //用来画表格的函数
}
else {//对错误的情况进行处理
// Result was Not-a-Number or infinite, which means the input was
// incomplete or invalid. Clear any previously displayed output.
payment.innerHTML = ""; // Erase the content of these elements
total.innerHTML = ""
totalinterest.innerHTML = "";
chart(); // With no arguments参数, clears the chart
}
}
// Save the user's input as properties属性 of the localStorage object. Those
// properties will still be there when the user visits in the future
// This storage feature will not work in some browsers (Firefox, e.g.) if you
// run the example from a local file:// URL. It does work over HTTP, however.
function save(amount, apr, years, zipcode) { //save函数主体实现
if (window.localStorage) { // Only do this if the browser supports it
localStorage.loan_amount = amount;
localStorage.loan_apr = apr;
localStorage.loan_years = years;
localStorage.loan_zipcode = zipcode;
}
window.localStorage
只读的localStorage
允许你访问一个Document
的远端(origin)对象 Storage
;数据存储为跨浏览器会话。 localStorage
类似于[sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window.sessionStorage)。
区别在于,数据存储在 localStorage
是无期限的,而当页面会话结束——也就是说当页面被关闭时,数据存储在sessionStorage
会被清除 。
应注意无论数据存储在 localStorage
还是 sessionStorage
,它们都特定于页面的协议。
源自Window.localStorage
没有看的解释1
}
// Automatically attempt to restore input fields when the document first loads.
window.onload = function() {
// If the browser supports localStorage and we have some stored data
if (window.localStorage && localStorage.loan_amount) {
document.getElementById("amount").value = localStorage.loan_amount;
document.getElementById("apr").value = localStorage.loan_apr;
document.getElementById("years").value = localStorage.loan_years;
document.getElementById("zipcode").value = localStorage.loan_zipcode;
}
};
// Pass the user's input to a server-side script which can (in theory理论上) return
// a list of links to local lenders interested in making loans. This example
// does not actually include a working implementation of such a lender-finding
// service. But if the service existed, this function would work with it.
function getLenders(amount, apr, years, zipcode) {
// If the browser does not support the XMLHttpRequest object, do nothing
if (!window.XMLHttpRequest) return;
XMLHTTPRequest对象可以在不刷新整个页面的前提下,实现局部刷新网页,jQuery中的Ajax就是基于此原理而开发的。frmo 一个简单的例子教你明白XMLHTTPRequest的原理
// Find the element to display the list of lenders in
var ad = document.getElementById("lenders");
if (!ad) return; // Quit if no spot for output