功能分析
基本功能
- 根据输入的数据，获取运算式的题数和运算式数值的范围。运算式中的数值以及符号随机出现。实现基本的 +、-、*、/ 的计算。
- 有分数时，出现的分数都是真分数的形式,输入结果能用带分数进行计算。
- 对生成的运算式计算结果，并且能在最后对输入的值进行判断。
扩展功能
- 表达式不重复
- 结果最简，
- 算符不超过三个
设计实现
- 生成随机数和随机符号
生成随机符号 sign()
生成随机数 ranNum(),约分 Common() - 生成运算式
生成运算式 ranData(), - 计算结果
数组转化为字符串 ranChange()
计算结果 ranRes()
4.判断计算式重复
判断函数 checkRepeat()
代码说明
HTML5 代码
<div id="main">
<label>请输入您要的范围（默认10）</label>
<input type="number" id="cNum">
<label>请输入您要的算式数（默认10）</label>
<input type="number" id="nNum">
<button id="button1">确认</button>
<form id="myform">
<div id="calm"></div>
<button id="button2" style="display: none;">提交</button>
<div id="grade" style="display:none;"></div>
</form>
</div>
js代码
var div = document.getElementById(‘calm‘);
var n = 0;
var asd, nNum, cNum;
var button1 = document.getElementById(‘button1‘);
var button2 = document.getElementById(‘button2‘);
var grade = document.getElementById("grade");
var rpt = []; // 定义变量存储运算数值（用于判重）
var ret; // 定义存储当前运算式
var result = []; // 定义变量存储结果
var result1; // 存储当前结果
// 随机符号
var sign = function(){
var str = [‘+‘,‘-‘,‘x‘,‘÷‘];
var a =Math.floor(Math.random()*4);
return str[a];
}
var Common = function(a,b){
var c = a % b;
if (c == 0) {
return b;
} else {
return Common(b, c);
}
}
// 随机数据(分数和整数)
var ranNum = function () {
var a, b;
var math = [];
var isFraction = Math.floor(Math.random() * 10);
// 随机设置为分数
if (isFraction > 5) {
var divisor;
a = Math.floor(Math.random() * cNum);
b = Math.floor(Math.random() * cNum + 1);
if (a == 0) {
math = 0;
} else {
if (a < b) {
divisor = Common(b ,a);
math = "(" + (a/divisor) + "/" + (b/divisor) + ")";
} else if (a > b) {
divisor = Common(a ,b);
math = "(" + (b/divisor) + "/" + (a/divisor) + ")";
} else {
math = 1;
}
}
} else {
a = Math.floor(Math.random() * cNum)
math = a;
}
// console.log(math + "number");
return math;
}
// 判断答案
var answer = function(a,b){
var c;
if(a.indexOf("-") == -1){
a = a.replace(/‘/,"+");
console.log(a);
console.log(eval(a));
}else{
a = a.replace(/‘/,"-");
console.log(a);
console.log(eval(a));
}
a = eval(a);
if(a == b ){
c = ‘right‘;
n++;
}else{
c = ‘wrong‘;
}
return c;
}
// 产生运算，随机运算式，放入数组
var ranData =function(){
// 随机运算式的长度
var data = Math.floor(Math.random()*3 + 1);
if(cNum >= 100){
data = 1;
}
var str = [];
var num1 = ranNum();
str.push(num1);
var num2;
var sin;
for(var i = 0; i < data;i++){
sin = sign();
str.push(sin);
num2 = ranNum();
if(sin == "÷"){
// 除数为0时，重新赋值
while(num2 == 0){
num2 = ranNum();
}
}
str.push(num2);
}
return str;
}
// 将运算时合并成字符串
var ranChange =function(data){
return data.join(‘‘);
}
// 计算式子的结果
var ranRes =function(data){
var str = [];
// console.log(data);
for(var i = 0;i<data.length;i++){
if(data[i] == ‘x‘){
data[i] = ‘*‘;
}
if(data[i] == ‘÷‘){
data[i] = ‘/‘;
}
str.push(data[i]);
}
var res = str.join(‘‘);
return eval(res);
}
// 判断重复函数
var checkRepeat =function(ret,result1){
for(var i = 0;i < rpt.length;i++){
// 判断长度
if(ret.length == rpt.length){
// 判断内容
if(ret.join == rpt[i].join){
// 判断结果
if(result[i] == result1){
return 1;
}
}
}
}
rpt.push(ret);
// console.log(rpt)
result.push(result1);
return 0;
}
// 运行主函数
var main =function(cNum,nNum){
var res = [];
for(var i = 0; i < nNum;i++){
var li = document.createElement(‘li‘);
var input =document.createElement(‘input‘);
// input.type = ‘number‘;
// input.className = name;
input.setAttribute("class", "name");
do{
var data = ranData(); //产生运算，随机运算式，放入数组
var putData = ranChange(data); // 将运算时合并成字符串
res.push(ranRes(data)); // 计算式子的结果
result1 = ranRes(data);
ret = data.sort();
}while(checkRepeat(ret,result1))
while(putData.indexOf("(") >= 0 || putData.indexOf(")") >= 0){
putData =putData.replace(")","");
putData =putData.replace("(","");
}
li.innerHTML ="<span class= ‘liSpan‘>第" + (i + 1) + "题</span> <span class= ‘liSpan1‘>" + putData + " = </span>";
li.appendChild(input);
div.appendChild(li);
}
return res;
}
// 确认运算式的范围和数量，生成运算式
button1.onclick = function(e){
e.preventDefault();
if(button2.style.display == "none"){
div.innerHTML = "";
grade.style.display = "none";
n = 0;
}
nNum = document.getElementById(‘nNum‘).value;
if(nNum <= 0){
nNum = 10;
}
cNum = document.getElementById(‘cNum‘).value;
if(cNum <= 0){
cNum = 10;
}
asd = main(cNum, nNum);
button1.disabled = true;
button2.style.display = "inline-block";
}
// 判断计算的结果，计算正确率
button2.onclick = function(e){
e.preventDefault();
var input =document.querySelectorAll(‘form input‘);
var li =document.querySelectorAll("form li")
for(var i = 0 ; i < input.length;i++){
var a = input[i].value;
var b = asd[i];
// console.log(answer(12));
var check = answer(a,b);
var span = document.createElement(‘span‘);
span.setAttribute("class", "span");
if(check == "right"){
span.style.color = "green";
}else{
span.style.color = "red";
}
span.innerHTML = check;
li[i].appendChild(span);
}
button2.style.display = "none";
button1.disabled = false;
grade.innerHTML = "正确率为 " + (n/nNum).toFixed(4)*100 + "%";
grade.style.display = "block";
// console.log(n/nNum);
}测试运行
---恢复内容结束---
需求分析
- 控制题目生成个数和题目范围
- 运算符不超过3个
- 题目不能重复
- 支持一万道题目
- 运算结果为分数
- 在生成题目的同时，计算出所有题目的答案
- 能判断答案的正误
功能分析
基本功能
- 根据输入的数据，获取运算式的题数和运算式数值的范围。运算式中的数值以及符号随机出现。实现基本的 +、-、*、/ 的计算。
- 有分数时，出现的分数都是真分数的形式,输入结果能用带分数进行计算。
- 对生成的运算式计算结果，并且能在最后对输入的值进行判断。
扩展功能
- 表达式不重复
- 结果最简，
- 算符不超过三个
设计实现
- 生成随机数和随机符号
生成随机符号 sign()
生成随机数 ranNum(),约分 Common() - 生成运算式
生成运算式 ranData(), - 计算结果
数组转化为字符串 ranChange()
计算结果 ranRes()
4.判断计算式重复
判断函数 checkRepeat()
代码说明
HTML5 代码
<div id="main">
<label>请输入您要的范围（默认10）</label>
<input type="number" id="cNum">
<label>请输入您要的算式数（默认10）</label>
<input type="number" id="nNum">
<button id="button1">确认</button>
<form id="myform">
<div id="calm"></div>
<button id="button2" style="display: none;">提交</button>
<div id="grade" style="display:none;"></div>
</form>
</div>
js代码
var div = document.getElementById(‘calm‘);
var n = 0;
var asd, nNum, cNum;
var button1 = document.getElementById(‘button1‘);
var button2 = document.getElementById(‘button2‘);
var grade = document.getElementById("grade");
var rpt = []; // 定义变量存储运算数值（用于判重）
var ret; // 定义存储当前运算式
var result = []; // 定义变量存储结果
var result1; // 存储当前结果
// 随机符号
var sign = function(){
var str = [‘+‘,‘-‘,‘x‘,‘÷‘];
var a =Math.floor(Math.random()*4);
return str[a];
}
var Common = function(a,b){
var c = a % b;
if (c == 0) {
return b;
} else {
return Common(b, c);
}
}
// 随机数据(分数和整数)
var ranNum = function () {
var a, b;
var math = [];
var isFraction = Math.floor(Math.random() * 10);
// 随机设置为分数
if (isFraction > 5) {
var divisor;
a = Math.floor(Math.random() * cNum);
b = Math.floor(Math.random() * cNum + 1);
if (a == 0) {
math = 0;
} else {
if (a < b) {
divisor = Common(b ,a);
math = "(" + (a/divisor) + "/" + (b/divisor) + ")";
} else if (a > b) {
divisor = Common(a ,b);
math = "(" + (b/divisor) + "/" + (a/divisor) + ")";
} else {
math = 1;
}
}
} else {
a = Math.floor(Math.random() * cNum)
math = a;
}
// console.log(math + "number");
return math;
}
// 判断答案
var answer = function(a,b){
var c;
if(a.indexOf("-") == -1){
a = a.replace(/‘/,"+");
console.log(a);
console.log(eval(a));
}else{
a = a.replace(/‘/,"-");
console.log(a);
console.log(eval(a));
}
a = eval(a);
if(a == b ){
c = ‘right‘;
n++;
}else{
c = ‘wrong‘;
}
return c;
}
// 产生运算，随机运算式，放入数组
var ranData =function(){
// 随机运算式的长度
var data = Math.floor(Math.random()*3 + 1);
if(cNum >= 100){
data = 1;
}
var str = [];
var num1 = ranNum();
str.push(num1);
var num2;
var sin;
for(var i = 0; i < data;i++){
sin = sign();
str.push(sin);
num2 = ranNum();
if(sin == "÷"){
// 除数为0时，重新赋值
while(num2 == 0){
num2 = ranNum();
}
}
str.push(num2);
}
return str;
}
// 将运算时合并成字符串
var ranChange =function(data){
return data.join(‘‘);
}
// 计算式子的结果
var ranRes =function(data){
var str = [];
// console.log(data);
for(var i = 0;i<data.length;i++){
if(data[i] == ‘x‘){
data[i] = ‘*‘;
}
if(data[i] == ‘÷‘){
data[i] = ‘/‘;
}
str.push(data[i]);
}
var res = str.join(‘‘);
return eval(res);
}
// 判断重复函数
var checkRepeat =function(ret,result1){
for(var i = 0;i < rpt.length;i++){
// 判断长度
if(ret.length == rpt.length){
// 判断内容
if(ret.join == rpt[i].join){
// 判断结果
if(result[i] == result1){
return 1;
}
}
}
}
rpt.push(ret);
// console.log(rpt)
result.push(result1);
return 0;
}
// 运行主函数
var main =function(cNum,nNum){
var res = [];
for(var i = 0; i < nNum;i++){
var li = document.createElement(‘li‘);
var input =document.createElement(‘input‘);
// input.type = ‘number‘;
// input.className = name;
input.setAttribute("class", "name");
do{
var data = ranData(); //产生运算，随机运算式，放入数组
var putData = ranChange(data); // 将运算时合并成字符串
res.push(ranRes(data)); // 计算式子的结果
result1 = ranRes(data);
ret = data.sort();
}while(checkRepeat(ret,result1))
while(putData.indexOf("(") >= 0 || putData.indexOf(")") >= 0){
putData =putData.replace(")","");
putData =putData.replace("(","");
}
li.innerHTML ="<span class= ‘liSpan‘>第" + (i + 1) + "题</span> <span class= ‘liSpan1‘>" + putData + " = </span>";
li.appendChild(input);
div.appendChild(li);
}
return res;
}
// 确认运算式的范围和数量，生成运算式
button1.onclick = function(e){
e.preventDefault();
if(button2.style.display == "none"){
div.innerHTML = "";
grade.style.display = "none";
n = 0;
}
nNum = document.getElementById(‘nNum‘).value;
if(nNum <= 0){
nNum = 10;
}
cNum = document.getElementById(‘cNum‘).value;
if(cNum <= 0){
cNum = 10;
}
asd = main(cNum, nNum);
button1.disabled = true;
button2.style.display = "inline-block";
}
// 判断计算的结果，计算正确率
button2.onclick = function(e){
e.preventDefault();
var input =document.querySelectorAll(‘form input‘);
var li =document.querySelectorAll("form li")
for(var i = 0 ; i < input.length;i++){
var a = input[i].value;
var b = asd[i];
// console.log(answer(12));
var check = answer(a,b);
var span = document.createElement(‘span‘);
span.setAttribute("class", "span");
if(check == "right"){
span.style.color = "green";
}else{
span.style.color = "red";
}
span.innerHTML = check;
li[i].appendChild(span);
}
button2.style.display = "none";
button1.disabled = false;
grade.innerHTML = "正确率为 " + (n/nNum).toFixed(4)*100 + "%";
grade.style.display = "block";
// console.log(n/nNum);
}测试运行
心得
第一次这样计算自己的项目耗时，时间不能很好的进行估算。特别是代码的用时，远远超过自己预计的时间。对于项目功能的划分，也不是很理想，在实际执行过程中产生了不少的问题，这也是导致代码耗时过长的原因之一。后期在自己原先规划的模块上面进行了不少的修改。
原文地址：https://www.cnblogs.com/jmulzy/p/9129903.html
时间： 2024-10-18 07:14:44