这个作业属于哪个课程 | https://bbs.csdn.net/forums/ssynkqtd-05 |
---|---|
这个作业要求在哪里 | https://bbs.csdn.net/topics/617377308 |
这个作业的目标 | 实现一个前后端分离的计算器 |
其他参考文献 | 无 |
0. 任务:
完成一个前后端分离的计算器,可以完成计算存储、利率计算等功能。
1.项目源码地址:
https://github.com/102101519/second
2.界面展示:
基础运算:
1697958859218
清零回退和错误提示:
1697958716375
利率计算:
1697959425531
3.PSP表格:
PSP | Personal Software Process Stages | 预估耗时(分钟) | 实际耗时(分钟) |
---|---|---|---|
Planning | 计划 | 20 | 20 |
• Estimate | • 估计这个任务需要多少时间 | 15 | 10 |
Development | 开发 | 300 | 300 |
• Analysis | • 需求分析 (包括学习新技术) | 400 | 400 |
• Design Spec | • 生成设计文档 | 30 | 30 |
• Design Review | • 设计复审 | 10 | 15 |
• Coding Standard | • 代码规范 (为目前的开发制定合适的规范) | 30 | 40 |
• Design | • 具体设计 | 30 | 40 |
• Coding | • 具体编码 | 300 | 350 |
• Code Review | • 代码复审 | 20 | 20 |
• Test | • 测试(自我测试,修改代码,提交修改) | 60 | 100 |
Reporting | 报告 | 60 | 60 |
• Size Measurement | • 计算工作量 | 10 | 10 |
• Postmortem & Process Improvement Plan | • 事后总结, 并提出过程改进计划 | 30 | 30 |
合计 | 1315 | 1425 |
4.代码说明:
点击按钮进行操作的代码:(dot()等函数功能已实现)
function clickButton(btnText) {
var resultNum = document.getElementById("result");
var optStr = resultNum.value;
if (btnText === '=') {
try {
var result = eval(optStr);
resultNum.value = result.toString();
if (resultNum.value === 'Infinity') {
throw new Error('Error: 除数不能为0');
}
} catch (error) {
if (resultNum.value === 'Infinity') {
resultNum.value = "Error: 除数不能为0";
} else {
resultNum.value = "Error";
}
}
}else if (btnText === '.') {
dot();
}else if (btnText === 'del') {
backspace();
}else if (btnText === 'square') {
square();
}else if (btnText === 'sqrt') {
square_root();
}else if (btnText === 'C') {
clear();
}else if (btnText === 'ans') {
combinedFunction();
}else {
try {
resultNum.value += btnText;
} catch (error) {
resultNum.value = "Error";
}
}
}
在点击按钮时,会通过上述代码分析应该进行什么操作,从而得出正确的反应。
利率计算器的代码:
function calculateDepositInterest() {
const amount = parseFloat(document.getElementById("amount").value);
const duration = parseFloat(document.getElementById("duration").value);
let interestRate;
if (duration <= 0.25) {
interestRate = 2.85;
} else if (duration <= 0.5) {
interestRate = 3.05;
} else if (duration <= 1) {
interestRate = 3.25;
} else if (duration <= 2) {
interestRate = 4.15;
} else if (duration <= 3) {
interestRate = 4.75;
} else {
interestRate = 5.25;
}
const result = amount * duration * interestRate / 100;
document.getElementById("resultrate").value = result.toFixed(2);
}
function calculateLoanInterest() {
const amount = parseFloat(document.getElementById("amount").value);
const duration = parseFloat(document.getElementById("duration").value);
let interestRate;
if (duration <= 0.5) {
interestRate = 5.85;
} else if (duration <= 1) {
interestRate = 6.31;
} else if (duration <= 3) {
interestRate = 6.40;
} else if (duration <= 5) {
interestRate = 6.65;
} else {
interestRate = 6.80;
}
const result = amount * duration * interestRate / 100;
document.getElementById("resultrate").value = result.toFixed(2);
}
function calculateInterest() {
const amount = parseFloat(document.getElementById("amount").value);
const duration = parseFloat(document.getElementById("duration").value);
let interestRate;
interestRate = 0.5;
const result = amount * duration * interestRate / 100;
document.getElementById("resultrate").value = result.toFixed(2);
}
这里分别对应定期存款、活期存款、贷款进行了三种不同的设计,通过不同的函数进行实现。
5.错误处理:
1.在进行不合理的开方,如负数开方的时候,会进行准确报错"Error:负数不能开方"。
2.在进行括号不匹配的计算时,会报错:“Error”。
3.在除0时,会进行准确报错:“Error:除数不能为0”。
4.其他暂时还未知的错误情况都会被捕获并抛出普通异常"Error"。
6.心路历程与收获:
1.在一开始查阅资料时,我认为本次作业可以将上次作业的可视化计算器加以改造并且运用在本次作业上面。后续经过更多地了解后,认为确实是可以将上次作业的计算器运用到本次作业上,但是由于其框架不同,导致其容易出现问题,所以最终决定放弃改造了一大半的计算器,将重点转移到网页端的设计上。所以浪费了很多时间。此时计算器已经完成了数据库方面的内容,可以成功连接数据库,上传、读取结果:
2.虽然改造的计算器没有发挥用处,但是我还是在改造的过程中得到了成长,学会了一定的关于数据库的操作。在将改造的计算器的代码转化为可以用的代码放入js也有利于加快网页端计算器的编写。
3.在html调用js时,经常会出现一些小问题,于是决定将两个文件的内容合并至一起,虽然不太美观,但是更有利于进行后续的操作。