本文介绍了作者参与的结对编程项目，旨在实现一个Web四则运算应用。项目包括接口设计、主要代码展示、程序运行流程及页面展示。作者描述了结对过程中的挑战和学习经历，强调了团队沟通和合作的重要性。后端开发者分享了从无到有的编程思路和遇到的错误，前端开发者则关注页面设计和用户体验，通过此次项目加深了对JavaScript的理解并认识到了自身的不足。
目录
一、Coding.net地址
详见地址：https://dev.tencent.com/u/Cuiyiran/p/jieduixiangmu-WEBsizeyunsuan2
二、接口设计
共有五个类来实现功能：
- Condition类
- Produce类
- Print类
- Main类
- ToFile类
主要函数流程图：
三、主要代码展示
1、将答案和结果进行比较
public static int doCal2(List<String> list ){
Stack<Integer> stack = new Stack<Integer>();
for(int i=0;i<list.size();i++){
String s = list.get(i);
int t=0;
if(!isOp(s)){
t = Integer.parseInt(s);
stack.push(t);
}else{
if(s.equals("+")){
int a1 = stack.pop();
int a2 = stack.pop();
int v = a2+a1;
stack.push(v);
}else if(s.equals("-")){
int a1 = stack.pop();
int a2 = stack.pop();
int v = a2-a1;
stack.push(v);
}else if(s.equals("*")){
int a1 = stack.pop();
int a2 = stack.pop();
int v = a2*a1;
stack.push(v);
}else if(s.equals("÷")){
int a1 = stack.pop();
int a2 = stack.pop();
if(a1==0)
return -1;
int v = a2/a1;
if(a2%a1!=0)
return -1;
if(a1==0)
return -1;
if(a2<a1 ){
return -1;
}
else
stack.push(v);
}
}
}2、根据要求生成题目
public class Request extends HttpServlet {
public Request() {
}
@Override
public void destroy() {
super.destroy();
}
@Override
public void init() throws ServletException {
super.init();
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request,response);
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
request.setCharacterEncoding("utf-8");
int n= Integer.parseInt(request.getParameter("quesNum"));
int max= Integer.parseInt(request.getParameter("maxNum"));
int min= Integer.parseInt(request.getParameter("minNum"));
int o= Integer.parseInt(request.getParameter("operScope"));
boolean c= Boolean.parseBoolean(request.getParameter("multi"));
boolean b= Boolean.parseBoolean(request.getParameter("bracket" ));
Produce p=new Produce();
ArrayList<String> s=new ArrayList<String>();
for(int i=0;i<n;i++){
s.add(p.needing(min,max,o,c,b));
}
String pt="..\\exam.txt";
Print.print("..\\exam.txt", s);
PrintWriter out = response.getWriter();
request.setAttribute( "pt",pt);
request.getRequestDispatcher( "/Online2.jsp").forward(request,response);
}3、对输入异常的处理
if(args[r].equals("-n") ){//输入异常处理
try {
n = Integer.parseInt(args[++r]);//控制命令行输入
if (n<0)
System.out.println("n必须是正整数");
}
catch (Exception e)
{
System.out.println("n必须是正整数");
}
}4、计时功能（包括开始、暂停、重置）
function Reset() //重置
{
window.clearInterval(int);
millisecond = hour = minute = second = 0;
document.getElementById('timetext').value = '00时00分00秒';
}
function start() //开始
{
int = setInterval(timer, 50);
}
function timer() //计时
{
millisecond = millisecond + 50;
if(millisecond >= 1000) {
millisecond = 0;
second = second + 1;
}
if(second >= 60) {
second = 0;
minute = minute + 1;
}
if(minute >= 60) {
minute = 0;
hour = hour + 1;
}
document.getElementById('timetext').value = hour + '时' + minute + '分' + second + '秒';
}
function stop() //暂停
{
window.clearInterval(int);
}5、题目的判错
function yesOrNo(){
//yes 为题目正确个数
//total为题目总个数&
var yes=0;
var total = document.getElementById("total_number").value;
var get_answer = document.getElementsByClassName("get_answer");
var yesOrNo = document.getElementsByClassName("gou");
var right_answer= document.getElementsByName("meng");
for(var i = 0; i < total ; i++){
//right_answer：传过来的答案
//get_answer：输入的答案
//get_ques：得到的题目
if(get_answer[i].value == right_answer[i].value){
yesOrNo[i].innerHTML="yes"+" "+right_answer[i].value;
yesOrNo[i].style.color="#00ad45";
yes++;
}else{
yesOrNo[i].innerHTML="no"+" "+right_answer[i].value;
yesOrNo[i].style.color="#ED3434";
}
}
var yesNum = document.getElementById("right_number");
yesNum.value = yes;
}四、程序运行流程
五、页面展示
开始答题界面
定制题目界面
进行答题界面
六、描述结对的过程
对于刚刚开始写结对项目的时候，我们觉得有些茫然，不知道自己应该从哪些方面开始着手，我们的页面应该是什么样子的？我们的功能又要有哪些？经过大概一个星期的讨论与合作，我们第一个项目也即将完成。在第一次磨合的过程中，我们有过困难，会为了为什么不出现想要的效果而愁眉苦脸，也会因为在苦苦寻找方法很久，最后发现竟然是一个因为粗心而导致的小问题而哭笑不得。最终，我们还是在项目中取长补短，一个人负责后端代码，一个人负责前端代码，一起合作完成了整个项目。在这次结对项目中，我们深刻体会到了团队沟通的重要性，也学会了如何更好的表达自己的想法与建议，以及认真的听取伙伴的意见。这次合作使我们两个人都收获很多，希望以后一起加油。
七、PSP
| PSP2.1 | 任务内容 | 计划共完成需要的时间(min) | 实际完成需要的时间(min) |
| Planning | 计划 | 60 | 45 |
| · Estimate | · 估计这个任务需要多少时间，并规划大致工作步骤 | 60 | 45 |
| Development | 开发 | 2295 | 4034 |
| · Analysis | · 需求分析 (包括学习新技术) | 70 | 90 |
| · Design Spec | · 生成设计文档 | 0 | 0 |
| · Design Review | · 设计复审 | 30 | 25 |
| · Coding Standard | · 代码规范 (为目前的开发制定合适的规范) | 45 | 60 |
| · Design | · 具体设计 | 90 | 106 |
| · Coding | · 具体编码
| 2000 | 3500 |
| · Code Review | · 代码复审 | 30 | 197 |
| · Test | · 测试（自我测试，修改代码，提交修改） | 30 | 54 |
| Reporting | 报告 | 165 | 241 |
| · Test Report | · 测试报告 | 120 | 150 |
| · Size Measurement | · 计算工作量 | 15 | 35 |
| · Postmortem & Process Improvement Plan | · 事后总结, 并提出过程改进计划 | 30 | 56 |
八、个人总结
后端：刚开始毫无头绪，感觉虽然核心代码是一样的，但是要想实现web的新需求还是要加上很多东西，而对于这些我没有一个具体的思路，后来浏览了很多学长学姐们的代码，抽丝剥茧，找到了大概的思路和实现方式；之前没有搞清楚前台可以实现的功能，后来发现和前端的小伙伴合作之后发现可以更加简单的实现功能；在实现功能的过程中遇见了很多之前没有遇到过的bug和爆红，这些错误给了我很重要的经验，感觉很充实。想写出一个好的程序，不止要有严谨的逻辑，还要有细心、耐心和精益求精的精神。总之，这次作业使我受益匪浅。
前端：我觉得对于前端来说，这次作业的页面如何设计，怎么可以使页面尽量的美观是非常重要的，对于页面的配色和结构与后端的小伙伴选择了很久，最后我们还是选择了这一种相似于教室黑板的背景。这次的前端页面主要是使用了HTML与CSS；在计时与判断题目是否正确，是由JS代码实现的，但是由于时间比较短，所以记时的功能完成的不是特别的完善。在这次的结对项目中觉得自己学会了很多，对JS了解的更加深刻，同时也深深的认识到自己的不足。我们在后期也同样意识到在项目开始的初期确定详细功能的重要性。希望下次合作中，我们可以更好地取长补短，一起努力。
扫一扫
1955
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
