一.前提
（1）GitHub地址：https://github.com/mingbiaoleung/FourOperationWeb
（2）调试环境：IntelliJ IDEA ，CHORME浏览器
二.作业要求
（1）基本要求
- 自动生成题目，单个题目最多不能超过4个运算符，操作数小于100。
- 用户可以输入答案。
- 若用户输入答案正确，则提示正确；若答案错误，则提示错误，并要提示正确答案是多少。
（2）扩展要求
- 可以出表达式里含有负整数（负整数最小不小于-100）的题目，且负数需要带括号，用户输入的结果不用带括号。如： 2 *（-4） = -8。
- 用户可以选择出题的个数（最多不能超过5个题目），答题结束可以显示用户答错的题目个数和答对的题目个数。
- 用户答题结束以后，程序可以显示用户答题所用的时间。
- 程序可以设置答题时间，时间设置为整数，单位为秒，最大不能超过120秒，若超过了答题时间未答题，则提示：时间已到，不能答题。
（3）结对成员
姓名：梁铭标 学号：201606120031 博客园地址：https://www.cnblogs.com/luengmingbiao/
姓名：刘杰 学号：201606120029 博客园地址：http://www.cnblogs.com/Winslow-liujie/
三.时间估算
结对项目软件过程耗时估计表与统计表
（时间单位：小时）
|
PSP2.1 |
个人软件实现阶段 |
预计时间 |
实际时间 |
|
Planning |
计划 |
1 |
2 |
|
· Estimate |
估计这个任务需要多少时间 |
10 |
20 |
|
Development |
开发 |
10 |
10 |
|
· Analysis |
需求分析 (包括学习新技术) |
1 |
1 |
|
· Design Spec |
生成设计文档 |
1 |
1 |
|
· Design Review |
设计复审 |
0.5 |
0.5 |
|
· Coding Standard |
代码规范 |
1 |
1 |
|
· Design |
具体设计 |
1 |
1 |
|
· Coding |
具体编码 |
1 |
1 |
|
· Code Review |
代码复审 |
0.5 |
0.5 |
|
· Test |
测试（自我测试，修改代码，提交修改） |
1 |
1 |
|
Reporting |
报告 |
1 |
1 |
|
Test Report |
测试报告 |
1 |
1 |
|
·workload |
计算工作量 |
0.5 |
0.5 |
|
·correction |
并提出过程改进计划 |
2 |
2 |
四：工作详情
（一）工作:
刘杰： 设计和编写界面交互部分、设计计时器。
梁铭标： 后台代码随机生成题目、前后端数据交互、判断正误。
（二） 部分功能代码介绍：
（1）题目获取功能：通过ajax异步获取一定数量的四则运算习题（前台）
$.ajax({
type: "POST",
url: "GetTitleInfoServlet",
dataType: "json",
data: jsonDate,
async:false,
contentType:"application/json;charset=UTF-8",
success: function (returnedData) {
var titleInfoJson = JSON.stringify(returnedData);
sessionStorage.setItem("title", titleInfoJson);
}
});
题目获取功能：通过ajax异步获取一定数量的四则运算习题（后台）
/** * 响应前端ajax生成一定数量的四则运算习题并返回到前台 * @param request * @param response * @throws ServletException * @throws IOException */ protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // 设置请求与响应的编码 request.setCharacterEncoding("UTF-8"); response.setCharacterEncoding("UTF-8"); response.setContentType("text/x-javascript;charset=utf-8"); response.setHeader("Cache-Control", "no-cache"); // 获取从页面中提交过来的JSON格式数据数据 String titleInfo = JsonService.readJSONData(request); JSONObject titleInfoJson = JSONObject.parseObject(titleInfo); // 根据前台传来的数据进行解析后生成相应的题目，并以JsonArray格式存储 JSONArray titleJsonArray = generateTitleJsonArray(titleInfoJson); // 把生成的题目返回到前台 PrintWriter printWriter = response.getWriter(); printWriter.write(titleJsonArray.toJSONString()); printWriter.flush(); printWriter.close(); }
（2）用户提交功能：首先经过校验机制判断是否输入答案，之后进行答案的比对运算出答对题数量。
//用户点击按钮提交题目答案并计算用户的正确数以及错误数
$('#summitUserAnswer').click(function () {
$('#summitUserAnswer').addClass('disabled'); // Disables visually
$('#summitUserAnswer').prop('disabled', true); // Disables visually + functionally
//初始化用户做对题目的数目
var trueNum = 0;
for (var i = 0; i < titleJsonLength; i++) {
var userAnswer = document.getElementById("input" + i).value;
if (userAnswer == correctAnswerArray[i]) {
var code = "<p class="card-text text-danger col-sm-4">正确</p>";
$('#title' + i).append(code);
trueNum++;
}else{
var code = "<p class="card-text text-danger">你答错了，正确答案为"+ correctAnswerArray[i] +"</p>";
$('#title' + i).append(code);
}
}
//做错的题目数量
var falseNum = titleJsonLength - trueNum;
// var count = "<p class="text-danger">恭喜你完成,你用了"+statisticalTime()/1000+"秒</p>"
var submitCode = "<div class="col-md-13">
" +
"<div class="card">
" +
"<div class="card-body">
" +
"<span><h5 class="card-title">答题结束</h5></span>
" +
"<p class="text-danger">恭喜你完成,你用了" + statisticalTime() / 1000 +
"秒, 你答对了" + trueNum + "道题, 答错了" + falseNum + "道题！请继续加油！" + "</p>
" +
"<div class='row' style="margin: 0px auto;display: table;">" +
"<a href="Title.html" class="btn btn-primary">重新生成题目</a>
" +
"</div>" +
"</div>
" +
"</div>
" +
"</div>";
$('#TitleCard').append(submitCode);
});
五.软件演示
软件入口地址：http://119.23.205.157:8888/SimpleFourOperationWeb_war/Title.html
1.首先进行选择题目类型以及题目个数
2.点击做题等待跳转到做题页面
3.计算题目后点击提交
六：结对照片
七:收获与感悟
在这一次结对小项目中，明确分工和一定的团队交流是非常重要的，可以达到事半功倍的效果。团队工作能增加成员的工作积极性。因为在面对问题的时候，会有人一起分担，共同尝试新的策略。两个人一起工作需要互相配合，如果想偷懒去干别的，就会拖延工作进度。在编程中，如果双方遇到一些问题，可以相互讨论，可以更快更有效地解决问题，互补双方的一些不足。本次结对子编程收益良多，感谢搭档刘杰的支持与帮助。