贪吃蛇小游戏/排序可视化

新年新气象，花花在这边祝大家2019年新年快乐！

在新的一年里面，我们的频道也会迎来一些变化。除了一如既往的讲题之外，我打算扩展我们频道的内容范围，包含且不限于：系统设计、机器学习、分布式计算、计算机视觉等。大家有什么想讲的内容也欢迎留言讨论。

老是讲题可能大家觉得有些枯燥（辛辛苦苦做视频一年还没人家小姐姐一天吸粉多），所以呢我也在尝试着增加节目的趣味性，让大家在轻松的环境下学习知识。但是，计算机科学是非常严谨的，写错任何一个符号都可能带来截然不同的结果（当然绝大多是情况下是无法通过编译，但也可能能够正常运行，mutation testing了解下），所以该啃的硬骨头还是要啃。

当然今天我们就不啃骨头了，我们使用Javascript和HTML5来做一些可有界面的东西（终于不再是terminal了）。

贪吃蛇可以作为游戏编程入门，排序可视化则可以帮助你更好的理解排序的过程。我们用的库呢是p5js，还提供一个在线编辑器，边写边运行。

贪吃蛇

排序可视化

游戏编程主程序比较简单，只有三个函数:

setup(); // 初始化

while (true) {

update(); // 更新

draw(); // 绘制

}

对于update() 贪吃蛇还比较好理解，根据当前速度移动一格就行了。

但是对于排序，如果我在update里面把所有的数全部排好了，那么draw()就会画出已经排序好的结果，中间过程就完全看不到了。所以在update()中，我们只能“走一步“，比如做一次比较if (a[i] > a[j]) swap(a[i], a[j]); 然后更新i、j的值，这样排序的过程就能被画出来了。

选择排序的单步实现

绘制当前的排序结果

好了，其他内容就看视频吧。记得关注我的频道哦～ YouTube/Bili 搜索 花花酱LeetCode