【2048小游戏】——原生js爬坑之遍历算法显示二维数组内容

最新推荐文章于 2022-12-26 21:01:41 发布

柳柳Elena

最新推荐文章于 2022-12-26 21:01:41 发布

阅读量346

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/qq_34235864/article/details/86168449

本文介绍了如何使用原生JavaScript实现2048小游戏的遍历算法，将二维数组内容显示在页面上。通过创建二维数组并存储行数和列数，然后在start()函数中生成随机数并添加到数组。遇到的挑战包括确保新数字不覆盖已有数字，随机生成2或4，以及每次增加两个新数字。通过updateView()函数遍历数组并将内容映射到页面的div元素，同时处理二维数组中值为0的情况，以保持页面显示与数组状态同步。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

【2048小游戏】——原生js爬坑之遍历算法显示二维数组内容

引言：做2048小游戏会将横纵方向的数字内容，存储在一个二维数组中，要将这个二维数组中的内容显示在页面上，就一定要用遍历算法来实现了。

一、二维数组存储

首先考虑用二维数组存储所有行数，列数 → var RN=4，CN=4;
然后再定义一个变量data 来保存这个二维数组 → var data;
游戏的所有主要执行程序都保存在start()函数下 → 启动游戏
保存存有行数，列数的二维数组到data中关键代码 ↓

function  start(){
     data=[];     //创建空数组保存在data中
     for(var r=0;r<RN;r++){    //r从0到<RN
          data.push([]);      //

最低0.47元/天解锁文章

200万优质内容无限畅学