小学四则运算练习题网页版结对项目报告

Posted 2021-02-15 apriler

一.项目结构

二.计算模块和界面模块间的调用

三.页面演示效果

四.遇到问题

五.知识点记录

六.新知识新技能

七.未实现但计划实现功能

八.学习目标与总结

---

项目地址：https://git.dev.tencent.com/hey_wuqw/webArithmetic.git

---

一.项目结构

二. 计算模块和界面模块间的调用

三.页面演示效果

四.遇到问题

1.check()方法（用于接收答题页面传来的参数，请求从answer.jsp（答题界面）转发到result.jsp（做题结果界面））需要访问makeQ()方法中的保存运算式子的字符串数组（即qlist）：同一个类中的一个方法里访问另一个方法的变量是不合理的。
——想到的三个解决方法（1已实践成功，2,3未实践不知是否可行）：
（1）定义一个全局变量（字符串数组qlist），这样就能在makeQ()方法中访问该变量
——问题：数组大小是固定的，在定义数组时用户传的numExp（出题数量）是未知的，这时定义数组变量无法确定数组大小，只能随便给一个足够大的数。但这样转为list集合放到中遍历时集合大小变为某固定值，会遍历出所有无内容的空值。
——解决：由于集合的大小是可变的，所以把集合list定为全局变量，集合再转换为数组：

String[] list2 = list.toArray(new String[list.size()]);

（2）给makeQ()定义一个返回值，返回qlist数组，check()调用返回值。
（3）由于answer.jsp中请求的目标资源是servlet中的check()，那么把该表量从makeQ()传到answer.jsp再传到check().
2.将foreach循环内的input框输入值传到servlet：
——设置一个ID

<c:set var="position" value="0"/>

每循环一次给name赋如下值且ID+1

<input name="s${position}" id="id${position}" style="width: 60px;"/>
<c:set var="position" value="${position+1}"/>

servlet中接收：

for(int i = 0;i<expNum;i++){
    userAn[i] = request.getParameter("s"+i);
}

3.for input String:””
——一开始expNum是makeQ()方法的局部变量，无法在check()中使用——expNum也定义为全局变量
4.把两个字符创变量userAn和correctAn用“==”来比较是否相等——字符串的比较用str1.equals(str2)

五.知识点记录

1.JSTL 中的属性:
items：用于接收集合（划重点）对象。varStatus:常用参数有index,count,current等，本次用到的count是用于从1开始的迭代技术（显示了题号）
待优化：
1.Arith类里creaeteExp()（生成加减法运算）和createExpWithMD()（生成简单四则运算）方法实现思路一模一样，代码重复率高；createExpWithBrac()（生成带括号的加减法运算）和createExpWithAll()（生成带括号的四则运算）也同理。
——预设优化方法：将重复代码抽出另封装在一个方法中，需要时再调用此方法。
2.在servlet层判断是否有乘除法和括号时用了大量的if else条件语句判断，逻辑简单但代码冗长，如下：

if( !MD && !Brac ){//没有乘除法和括号
    for (int i=0; i<expNum; i++)
        qlist[i] = question.createExp(fuNum, upper, lower);
}else if ( !MD && Brac ){//没有乘除法有括号
    for (int i=0; i<expNum; i++)
        qlist[i] = question.createExpWithBrac(fuNum, upper, lower);
}else if ( MD && !Brac ){//有乘除法没有括号
    for (int i=0; i<expNum; i++)
        qlist[i] = question.createExpWithMD(fuNum, upper, lower);
}else{//既有乘除法又有括号
    for (int i=0; i<expNum; i++)
        qlist[i] = question.createExpWithAll(fuNum, upper, lower);
}

3.controller层包含了较多的逻辑业务处理功能，背离controller层的真正存在意义。如check()方法中涵盖了生成计算结果，并把计算结果的存入数组的逻辑。

六.新知识新技能

我和我的结对伙伴都是主要学习后端的，关于前端编写我们速学了一下bootstrap，用了bootstrap的基本模板，再进行修改，得到的页面真的是整洁美观，还具备兼容性，特别好用。

七.未实现但计划实现功能

1.错题报告（将错误题目及答案列出，生成错题集）
2.生成题目文件并课下载
3.做题历史记录

八.学习目标与总结

浏览了上届学长学姐这个结对项目的博客，发现他们有大量的篇幅都是在做代码性能分析，之前从来没有接触过，感觉可以学一学。这次涉及人机交互界面的设计，让我意识到在进行后端技术学习时也可以抽空学学前端，能自己完成一个项目的同时，也能更好的理解前后端的交互。