Javascript 平铺地图。 （带有表情符号）

Question

我想做一个可以生成地图的代码。 我试过这个：

      var mapArray = [
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ,1, 1, 1, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 3, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1 ,1, 1, 1, 1],
    ];
    
    function drawMap() {  
        let map = "";
        for (var y = 0; y < mapArray.length; y++) {
            for (var x = 0; x < mapArray[y].length; x++) {
                if (parseInt(mapArray[y][x]) == 0) {
                  var title = map.concat("⬛");
                }
                if (parseInt(mapArray[y][x]) == 1) {
                  var title = map.concat("⬜");
                }
                if (parseInt(mapArray[y][x]) == 2) {
                  var title = map.concat("🔴");
                }
                if (parseInt(mapArray[y][x]) == 3) {
                  var title = map.concat("🔵");
                }
                title.x = x * 28;
                title.y = y * 28;
                console.log(map)
                return map;
            }
        }
    }   
    drawMap()

我试过这段代码，但它记录为空。 然后我尝试将console.log(map)移动到函数的末尾，它再次记录为空。

Answer 1

首先，您可以使用.map()函数遍历数组，我猜您正在尝试这样做

其次，您的if方法并不是真正可扩展的，当您的地图中出现新数字时，您将需要编写更多if语句（例如 4、5、6）

这两者的结合：

// dictionary for storing number:image pair
const dictionary = {
  0: "⬛",
  1: "⬜",
  2: "🔴",
  3: "🔵"
}

// function arguments is array and tictionary
function transformArray(arr, dict) {
  // iterating through every `insideArray` in `arr`
  return arr.map(insideArray => {
    // iterating through every `item` in `insideArray`
    return insideArray.map(item => {
      // trying to lookup image in dictionary
      // if there is no `item` key - return default value ""
      return dict[item] || ""
    })
  })
}

const tranfsormedArray = transformArray(mapArray, dictionary)

console.log(transformedArray)