零、前言
这次的作业比较特殊，有两种做法。由于我对网页很熟悉，所以选择网页。
细节不赘述，下面写一下这次作业的几个亮点。
一、亮点
最大的亮点就是这个页面是纯客户端的，没有服务端。也就是说所有功能都是在本地完成。
简单介绍几个技术难点：
1、本地读文件
一般情况下读文件的过程是：上传文件到服务器——服务器读文件——服务器返回文件内容。
由于没有服务端，所以要在本地读文件，我用到了ActiveX，具体可以看readText()函数。
不夸张的说，80%写网站的人不会写js本地读文件。
2、网页端运行Python代码
由于我之前的作业是用Python写的，我又不想用js重新写一遍，所以在网页端解析并运行Python代码。这里用到了一个插件——skulpt，在这个插件的帮助下可以在网页端模拟运行Python代码。
3、js多行字符串
熟悉网页的人都知道，js是不支持多行字符串的，唯一的办法是转义回车符。但是由于Python代码对格式要求很严，所以转义之后输出的代码无法运行。我采用了一个曲线救国的方法，就是先把代码写到textarea里面，然后用jquery读出来，这样就可以存到变量里了。把testarea设置为不可见，不影响美观。
4、模拟单步执行
采用的方法是先把数据跑一遍，记录下来每步的状态，然后根据当前显示步数的不同来显示。
5、自动执行
自动执行使用了一个比较巧的办法，设置了一个变量来记录是否需要自动执行，然后有一个函数每隔一秒就检测一次，如果变量为true就自动执行。然后通过按钮来改变变量值。
6、改变文件上传按钮样式
出于安全考虑，默认文件上传按钮是无法更改样式的，我采用了一个很巧的办法，就是把文件上传按钮设置为不可见，然后在另一个按钮的click事件中trigger文件上传按钮的click事件，并将文件上传按钮的onchange事件绑定到函数，这样就实现了改变文件上传按钮样式。
二、截图展示
首先看看初始界面
可以看到两种输入方式都有，并且可以选择vha参数。
测试一下文件输入：
可以看到选择好文件后，界面上就会出现矩阵以及操作按钮
我们点两下单步执行
可以看到左右的矩阵发生了变化，很直观的看出当前值以及最优值及其具体子矩阵
我们试一下手动设置参数
设置行列
点击生成矩阵
可以看到自动生成了矩阵
三、动态规划（附加题）
原理：
动态规划算法通常用于求解具有某种最优性质的问题。在这类问题中，可能会有许多可行解。每一个解都对应于一个值，我们希望找到具有最优值的解。动态规划算法与分治法类似，其基本思想也是将待求解问题分解成若干个子问题，先求解子问题，然后从这些子问题的解得到原问题的解。与分治法不同的是，适合于用动态规划求解的问题，经分解得到子问题往往不是互相独立的。若用分治法来解这类问题，则分解得到的子问 题数目太多，有些子问题被重复计算了很多次。如果我们能够保存已解决的子问题的答案，而在需要时再找出已求得的答案，这样就可以避免大量的重复计算，节省 时间。我们可以用一个表来记录所有已解的子问题的答案。不管该子问题以后是否被用到，只要它被计算过，就将其结果填入表中。这就是动态规划法的基本思路。 具体的动态规划算法多种多样，但它们具有相同的填表格式。
展示：
我做了一个动态GIF图片来展示
可以很直观的看到状态转移以及记录的改变。
四、单元测试以及代码覆盖率
老师的要求是UI界面不要求单元测试，我这个整体就是一个UI界面，只不过包含了很多功能，但是本质上都是客户端代码，所以没有进行单元测试和代码覆盖率测试。
五、时间
|
Personal Software Process Stages |
时间百分比(%) |
实际花费的时间 (分钟) |
原来估计的时间 (分钟) |
|
计划 |
10% | 18 | 12 |
|
· 估计这个任务需要多少时间，把工作细化并大致排序 |
10% | 18 | 12 |
|
开发 |
85% | 153 | 102 |
|
· 需求分析 (包括学习新技术) |
15% | 27 | 18 |
|
· 设计复审 (和同事审核设计文档) |
10% | 18 | 12 |
|
· 代码规范 (制定合适的规范) |
5% | 9 | 6 |
|
· 具体设计 |
10% | 18 | 12 |
|
· 具体编码 |
35% | 63 | 42 |
|
· 代码复审 |
5% | 9 | 6 |
|
· 测试（自我测试，修改代码，提交修改） |
5% | 9 | 6 |
|
总结报告 |
5% | 9 | 6 |
| 总计 | 100% | 总用时 180 |
总估计的用时 120 |