貪吃蛇遊戲想必沒人會感到陌生,這個遊戲的js版本在網上也是一搜一大把,今天我要介紹的仍然是如何用js做一個貪吃蛇遊戲,但在關鍵一步,蛇的運動的實現上略有不同。
貪吃蛇的js版本通常用連續的方塊元素來實現蛇身,蛇的運動處理一般是這樣的,讓蛇頭向運動方向偏移一格,其後的元素依次移向前一個元素的位置,從而實現蛇的移動,這裏有一個更簡單的方法,就是直接將蛇尾移到蛇頭的移動位置,這樣也可以實現移動效果,但只需要對一個元素進行一次DOM操作即可,無論從實現難度還是遊戲性能方面,都有很大的優勢。
基於這個核心重新實現了一次貪吃蛇遊戲,並且完善了遊戲的關卡設計,效果如下:
效果預覽:http://refined-x.com/projects/codes/snake.html
詳細思路分析:http://refined-x.com/2017/06/19/%E5%86%8D%E5%81%9A%E4%B8%80%E6%9D%A1%E8%B4%AA%E5%90%83%E8%9B%87/