前端第二次作业——以取宝石为情景的NIM游戏
1.整体完成状况
1.1本次作业耗时：约两天半（2023.10.18——2023.10.20）
1.2作业目标达成状况（5/8）
基本要求：
1.用户能够自由输入l，r，n的值，并且游戏开始后能在页面显示每一次取宝石后剩余的宝石数量（√）
2.电脑能自动取宝石（√）
加分项：
1.识别用户输入的值是否符合规范，不规范时发出警告（√）
2.用户能选择自己先选还是后选（√）
3.电脑每次能按照“最优解”取宝石（√）
4.美观的界面
5.舒适的交互
6.多样的玩法（如pvp模式）（x）
1.3页面效果：
2.完成经过
2023.10.18：构思程序，着手搭建框架.在草稿纸上大概构建了本次取宝石游戏的js程序逻辑框架。
（......不过最后大改了程序，最终成品已经和之前写的没太大关系了）
2023.10.19：开始专注敲宝石游戏的js代码！但遇到较大阻力，导致作业进度一度陷入停滞。这天结束时代码仍有核心难题未解决。
2023.10.20：想通了核心难题的解决方法，成功实现了“电脑取最优解”、“用户选取先后手”和“识别用户输入数据规范与否”的加分项。完善CSS进一步美化页面。
3.遇到的困难及学到的知识
3.1遇到的困难
1. 无法实现跨页面调取变量。（无法让多个函数公用同一个变量）
在最开始的构想中，我想让用户设置好游戏数据后跳转到新页面进行游戏，而这时我就需要让多个子页面的函数都能调用l、r、n这三个值。
但很遗憾，多次上网搜索无果外加尝试屡屡碰壁后，我不得不放弃设立多个页面的方案。
解决方案：将功能合并至一页，并建立一个储存变量的临时div框。
当游戏开始运行时再从左侧的游戏设置文本框里读取l、n、r。然后设立一个隐藏的div框储存“剩余宝石数m”。点击开始游戏时，令该div框的值为n。接着，电脑开始取宝石。电脑会去读取这个div里的值，把并它赋给“剩余宝石数m”。然后电脑分析数据取走宝石，并把取完之后新的“剩余宝石数m"的值重新赋给div框。
- 仍然无法熟练应用flex调整布局
调整页面样式时，本打算用自适应性比较好的flex调整元素。虽然培训时已经介绍过，无奈flex内容太多太杂，我看了半天实在没搞懂。
解决方案：用fixed、relative替代。
- 无法合理搭建优美的函数语句。过度依赖用一个函数解决所有问题。
在写本次作业的js代码时，我推翻重建了很多次代码。最后靠疯狂打补丁勉强满足了要求。我认为这是由于我本人对编程了解太浅，尚未培养出编程思维导致的。
解决方案：一边找漏洞一边疯狂打补丁。
（js用了128行代码，而且结构十分扑朔迷离。如图，甚至出现了一个if里套三个if两个else if的奇观。我自己都不一定能看懂写了个啥东西......）
反思：多动手强化编程能力，争取早日摆脱想一出是一出的小白思维。
3.2学到的知识
- 学会了读取用户输入的数据和输出数据到对应区域。
主要是熟悉了修改与获取DOM节点。比如.innerHTML后缀是改变在网页显示的内容，.value后缀是改变其中的值，.style是改变目标的样式......等等。
- 更加熟悉js的使用。
此前从来没有了解过js，很高兴这次作业给了我一个运用简单js知识锻炼技巧的机会！
- 大大提升了自信（？）
嗯，确实很有成就感。
4.总结陈词
本次作业中，我进一步熟悉了js的使用，基本完成了任务。很高兴能有机会做这么一个有趣又富有挑战性的作业！
