Javascript for循環不循環數組

我正在嘗試閱讀TMX文件中的平臺級別。我正在試圖繪製tileset以查看我的代碼是否正常工作。這是我如何加載地圖：Javascript for循環不循環數組

function TileMapLayer(mapWidth, mapHeight, tileWidth, tileHeight, layerName, tileData) { 
'use strict'; 
    var name = layerName, 
    width = mapWidth, height = mapHeight, 
    // An array of integers used to figure out whether there is a tile in the 
    // player's position 
    map = [width][height]; 
    // The tileset that makes up the tilemap 
    this.tileSet = Game.res.getImage('tileSet'); 
    var data = tileData; 

    function getWidth() {return width;} 
    function getHeight() {return height;} 
} 

TileMapLayer.prototype.draw = function() { 
     'use strict'; 
    ctx.beginPath(); 
    ctx.drawImage(this.tileSet, canvasWidth/2, canvasHeight/2); 
    ctx.closePath(); 
}; 

function TileMap() { 
    'use strict'; 
    this.mapLayers = []; 
} 

TileMap.prototype.loadFile = function(pathToFile) { 
    'use strict'; 
    var xhr = new XMLHttpRequest(); 
    var that = this; 
    xhr.onreadystatechange = function() { 
     if(xhr.readyState === 4) { 
      // read in xml file 
      var domParser = new DOMParser(); 
      var mapData = domParser.parseFromString(xhr.responseText, 'text/xml'); 
      var mapAttributes = mapData.getElementsByTagName('map')[0].attributes; 
      // get tileset location 
      var tileSet = mapData.getElementsByTagName('tileset')[0].getElementsByTagName('image')[0].attributes; 
      Game.res.addImage('tileSet', '/home/agoston/Documents/js/platformer/res/maps/' + tileSet.getNamedItem('source').nodeValue); 
      // get map & tile dimensions 
      that.width = parseInt(mapAttributes.getNamedItem('width').nodeValue); 
      that.height = parseInt(mapAttributes.getNamedItem('height').nodeValue); 
      that.tileWidth = parseInt(mapAttributes.getNamedItem('tilewidth').nodeValue); 
      that.tileHeight = parseInt(mapAttributes.getNamedItem('tileheight').nodeValue); 

      // get layer data 
      var layers = mapData.getElementsByTagName('layer'); 

      // create layers 
      for(var i = 0; i < layers.length; ++i) { 
       that.mapLayers[i] = new TileMapLayer(that.width, that.height, 
                    that.tileWidth, 
                    that.tileHeight, 
                    layers[i].attributes.getNamedItem('name').nodeValue, 
                    layers[i].getElementsByTagName('data')[0]); 
      } 

     } 
    }; 
    xhr.open('GET', pathToFile, true); 
    xhr.send(null); 
}; 

TileMap.prototype.draw = function() { 
    // this block of code doesn't execute 
    for(var i = 0; i < this.mapLayers; ++i) { 
     console.log('drawing map layers'); 
     this.mapLayers[i].draw(); 
    } 
};

但是，應該穿過地圖圖層數組的循環根本不會循環。當我嘗試畫使用此數組中的第一個圖層：

TileMap.prototype.draw = function() { 
    this.mapLayers[0].draw(); 
};

它繪製的地形設置的圖像，但它給這個錯誤：

TypeError: this.mapLayers[0] is undefined

有誰知道爲什麼發生這種情況？如果你願意，你可以在這裏找到TMX文件：http://pastebin.com/MYdJCHfQ

來源

2015-09-13 user3814613

你是不是指'for（var i = 0; i kes

什麼是'map = [width] [height];'應該這樣做？ – Teemu

@scrapdog是的。對不起，愚蠢的錯誤。 – user3814613

看起來像mapLayers是一個你想迭代的數組，但是你錯過了它的length屬性來告訴循環何時停止循環。也許這會有所幫助：

for(var i = 0, j = this.mapLayers.length; i < j; ++i) { 
     console.log('drawing map layers'); 
     this.mapLayers[i].draw(); 
    }

來源

2015-09-13 18:10:15

謝謝。我將它改爲在評論中發佈的剪貼簿。 – user3814613

Javascript for循環不循環數組

回答

相關問題