个人中心
gpt4 book ai didi

javascript - 未捕获的类型错误 : Cannot read property 'length' of undefined [JavaScript]

转载 作者：行者123 更新时间：2023-12-03 07:35:56 25 4
gpt4 key购买 nike

所以我正在尝试制作俄罗斯方 block 游戏，但是当我在浏览器中打开它时，我得到 Uncaught TypeError: Cannot read property 'length' of undefined. Tetris.html:245在 JavaScript 控制台中。然后我去看了一下，它看起来不错，所以我把它发布到 Stackoverflow 上，因为我不知道出了什么问题。第 245 行位于 checkMove(xpos, ypos, newState) function this 这就是该行的代码。 for (var r = 0, len = curPiece.states[newState].length; r < len; r++) {//code goes here}这是整个 HTML/

<!DOCTYPE HTML>
<HTML lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="description" content="null">
		<meta name="author" content="null">
		<meta name="title" content="Tetris Clone">
		<title title="Tetris - HTML5">
			Tetris - HTML5
		</title>
		<link rel="apple-touch-icon" href="null">
		<link rel="shortcut icon" href="null">
		<link rel="stylesheet" type="text/css" href="css/tetris.css">
		<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.js"></script>
		<script type="text/javascript" src="http://gigaboywebdesigns.com/ClassStyles.js"></script>
		<script type="text/javascript" src="js/style.js"></script>
	</head>
	<body class = "body">
		<center>
			<div id = "gameboard">
				<canvas id = "gameCanvas" class = "gameCanvas" width = "320" height = "640"></canvas>
			</div>
			
			<div id = "score" class = "score">
				<p>Lines: <span id = "lines" class = "lines"></span></p>
			</div>
		</center>
		
		<script type = "text/javascript" src = "js/pieces.js"></script>
		<script type = "text/javascript" src = "js/BulkImageLoader.js"></script>
		
		<script type = "text/javascript">
			var ROWS = 20;
			var COLS = 10;
			var SIZE = 32;
			
			var canvas
			var ctx;
			var blockImg;
			var bgImg;
			var gameOverImg;
			var curPiece;
			var gameData;
			var imgLoader;
			var prevTime;
			var curTime;
			var isGameOver;
			var lineSpan;
			var curLines;
			
			window.onload = onReady;
			
			function onReady() {
				imgLoader = new BulkImageLoader();
				imgLoader.addImage("blocks.png", "blocks");
				imgLoader.addImage("bg.png", "bg");
				imgLoader.addImage("over.png", "gameover");
				imgLoader.onReadyCallback = onImagesLoaded;
				imgLoader.loadImages();
				
				canvas = document.getElementById("gameCanvas");
				ctx = canvas.getContext("2d");
				lineSpan = document.getElementById("lines");
				
				prevTime = curTime = 0;
				
				document.onkeydown = getInput;
			}
			
			function getInput(e) {
				
			}
			
			function onImagesLoaded(e) {
				blockImg = imgLoader.getImageAtIndex(0);
				bgImg = imgLoader.getImageAtIndex(1);
				gameOverImg = imgLoader.getImageAtIndex(2);
				initGame();
			}
			
			function initGame() {
				var r, c;
				curLines = 0;
				isGameOver = false;
				
				if (gameData == undefined) {
					gameData = new Array();
					
					for (r = 0; r < ROWS; r++) {
						gameData[r] = new Array();
						
						for (c = 0; c < COLS; c++) {
							gameData[r].push(0);
						}
					}
				} else {
					for (r = 0; r < ROWS; r++) {
						for (c = 0; c < COLS; c++) {
							gameData[r][c] = 0;
						}
					}
				}
				
				curPiece = getRandomPiece();
				lineSpan.innerHTML = curLines.toString();
				
				var requestAnimFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame;
				
				window.requestAnimationFrame = requestAnimFrame;
				
				requestAnimationFrame(update);
			}
			
			function update() {
				curTime = new Date().getTime();
				
				if (curTime - prevTime > 500) {
					if (checkMove(curPiece.gridx, curPiece.gridy + 1, curPiece.curState)) {
						curPiece.gridy += 1;
					} else {
						copyData(curPiece);
						curPiece = getRandomPiece();
					}
					
					prevTime = curTime;
				}
				
				ctx.clearRect(0, 0, 320, 640);
				drawBoard();
				drawPiece(curPiece);
				
				if (isGameOver == false) {
					requestAnimationFrame(update);
				} else {
					ctx.drawImage(gameOverImg, 0, 0, 320, 640, 0, 0, 320, 640);
				}
			}
			
			function copyData(p) {
				var xpos = p.gridx;
				var ypos = p.gridy;
				var state = p.curState;
				
				for (var r = 0, len = p.states[state].length; r < len; r++) {
					for (var c = 0, len2 = p.states[state][r].length; c < len2; c++) {
						if (p.states[state][r][c] == 1 && ypos >= 0) {
							gameData[ypos][xpos] = (p.color + 1);
						}
						
						xpos += 1;
					}
					
					xpos = p.gridx;
					ypos += 1;
				}
				
				checkLines();
				
				if (p.gridy < 0) {
					isGameOver == true;
				}
			}
			
			function checkLines() {
				var lineFound = false;
				var fullRow = true;
				var r = ROWS - 1;
				var c = COLS -1;
				
				while(r >= 0) {
					while(c >= 0) {
						if (gameData[r][c] == 0) {
							fullRow = false;
							c = -1;
						}
						c--;
					}
					
					if (fullRow == true) {
						zeroRow(r);
						r++;
						lineFound = true;
						curLines++;
					}
					
					fullRow = true;
					c = COLS - 1;
					r--;
				}
			}
			
			function zeroRow(row) {
				var r = row;
				var c = 0;
				
				while (r >= 0) {
					while (c < COLS) {
						if (r > 0) {
							gameData[r][c] = gameData[r-1][c];
						} else {
							gameData[r][c] = 0;
						}
						c++;
					}
					
					c = 0;
					r--;
				}
			}
			
			function drawBoard() {
				ctx.drawImage(bgImg, 0, 0, 320, 640);
				
				for (var r = 0; r < ROWS; r++) {
					for (var c = 0; c < COLS; c++) {
						ctx.drawImage(blockImg, (gameData[r][c] - 1) * SIZE, 0, SIZE, SIZE, c * SIZE, r * SIZE, SIZE);
					}
				}
			}
			
			function drawPiece(p) {
				var drawX = p.gridx;
				var drawY = p.gridy;
				var state = p.curState;
				
				for (var r = 0, len = p.states[state].length; r < len; r++) {
					for (var c = 0, len2 = p.states[state][r].length; c < len2; c++) {
						if (p.states[state][r][c] == 1 && drawY >= 0) {
							ctx.drawImage(blockImg, p.color * SIZE, 0, SIZE, SIZE, drawX * SIZE, drawY * SIZE, SIZE, SIZE);
						}
						
						drawX += 1;
					}
					
					drawX = p.gridx;
					drawY += 1;
				}
			}
			
			function checkMove(xpos, ypos, newState) {
				var result = true;
				var newx = xpos;
				var newy = ypos;
				
				for (var r = 0, len = curPiece.states[newState].length; r < len; r++) {
					for (var c = 0, len2 = curPiece.states[newState][r].length; c < len2; c++) {
						if (newx < 0 || newx >= COLS) {
							result = false;
							c = len2
							r = len;
						}
						
						if (gameData[newy] != undefined && gameData[newy][newx] != 0 && curPiece.states[newState][r] != undefined && curPiece.states[newState[r][c]] != 0) {
							result = false;
							c = len2;
							r = len;
						}
						
						newx += 1;
					}
					
					newx = xpos;
					newy += 1;
					
					if (newy > ROWS) {
						r = len;
						result = false;
					}
				}
				
				return result;
			}
		</script>
	</body>
</HTML>

JS 文件(如果需要)。

最佳答案

简而言之，curPiece.states[newState] 未定义。您放在那里的代码有很多需要查看的内容，但您应该回答为什么未定义的问题。可能是 newState 不正确，也可能是 states 完全未定义。可能是操作顺序错误，还没有创建。

对 for 循环之前的 curPiece.states 值进行一些调试。还要检查 newState 是什么。然后报告最新情况，以便人们可以在需要时为您提供进一步帮助。

关于javascript - 未捕获的类型错误 : Cannot read property 'length' of undefined [JavaScript]，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35614736/

25 4 0
文章推荐： javascript - Tampermonkey 脚本没有重定向到预期的 URL？
文章推荐： .net - Web API 接口(interface)在本地工作，但在部署到 Azure 网站后得到 404
文章推荐： ocr - 如何使用图像数据而不是字体文件训练 tesseract 4？
文章推荐： javascript - 内容更改时如何进行 Angular 链接更新
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com