javascript : 객체가 정의되지 않았습니다.

Question

다른 함수로 작성된 객체를 참조하려고 할 때 '객체가 정의되지 않았습니다.'오류가 발생합니다. 이것은 내가 얻을

오류입니다 .. 전에 다른 프로그램에서 일했다이 제외 범위 문제 같은 소리 '포착되지 않은 참조 오류 : 사람이 정의되지 않은'.. 내 코드의

부분이 아래와 같이 표시됩니다하십시오 사람 개체가 buildMap() 함수에서 생성되는 위치는 참조 I에 PlayGame 있습니다 ..() 함수에 man 로컬 영역이기 때문에이다

var canvas = document.querySelector("canvas"); 
var drawingSurface = canvas.getContext("2d"); 

var man; 

// Map code 

var EMPTY = 0; 
var TREE_BOTTOM = 1; 
var TREE_TOP = 2; 
var SKY = 3; 
var CLOUD = 4; 
var CLOUD_LEFT = 5; 
var CLOUD_RIGHT = 6; 
var PLATFORM = 7; 
var EGG = 8; 
var CAVE = 9; 
var MEAT = 10; 
var MAN = 11; 
var DINO = 12; 
var GUARD = 13; 
var GROUND = 14; 

// Map array 

var map = [ 
      [3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3], 
      [3,3,3,3,3,3,3,3,5,6,3,3,3,3,3,3,3,3,3,3,5,6,3,3], 
      [3,3,5,6,3,3,4,3,3,3,3,3,3,3,5,6,3,3,3,3,3,3,3,3], 
      [3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,9,3,3,3], 
      [3,7,7,3,3,3,3,3,3,3,3,3,3,3,3,3,7,7,7,7,7,7,3,3], 
      [3,3,3,3,3,3,3,3,3,7,3,3,3,3,3,3,3,3,3,3,3,3,3,3], 
      [3,3,3,7,7,7,3,3,3,3,3,3,7,7,3,3,3,3,3,3,3,4,3,3], 
      [3,3,3,3,3,3,3,3,5,6,3,3,3,3,3,3,3,3,3,3,3,3,3,3], 
      [3,3,4,3,3,3,3,3,3,3,3,3,4,3,3,7,7,7,7,7,3,3,3,3], 
      [3,3,3,3,3,7,7,7,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3], 
      [3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,3,4,3,3,3], 
      [3,3,3,3,3,3,3,3,3,3,3,7,7,7,7,3,3,3,3,3,3,3,3,3], 
      [3,3,2,3,3,3,3,3,3,3,2,3,3,3,3,3,2,3,3,3,2,3,3,3], 
      [14,14,1,14,14,14,14,14,14,14,1,14,14,14,14,14,1,14,14,14,1,14,14,14] 
      ]; 

var gameObjects = [ 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,8,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,13,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,12,0,0,0,0,0,0,0,8,12,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,12,0,8,0,0,0,0], 
        [0,0,0,0,0,10,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0], 
        [0,0,0,0,0,0,11,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0] 
        ]; 

// Cell size 

var SIZE = 32; 





// The number of rows and columns 

var ROWS = map.length; 
var COLS = map[0].length; 

// Sprite object 

var spriteObject = 
{ 
    sourceX: 0, 
    sourceY: 0, 
    sourceWidth: 32, 
    sourceHeight: 32, 
    width: 32, 
    height: 32, 
    x: 0, 
    y: 0, 
    vx: 0, 
    vy: 0, 
    visible: true, 

    //Getters 
    centerX: function() 
    { 
    return this.x + (this.width/2); 
    }, 
    centerY: function() 
    { 
    return this.y + (this.height/2); 
    }, 
    halfWidth: function() 
    { 
    return this.width/2; 
    }, 
    halfHeight: function() 
    { 
    return this.height/2; 
    }, 
}; 

//arrays to store game objects 

var sprites = []; 
var eggs = []; 
var dinos = []; 
var platforms = []; 

var assetsToLoad = []; 
var assetsLoaded = 0; 

//load the tilesheet 

var image = new Image(); 
image.addEventListener("load", loadHandler, false); 
image.src = "../images/spritesheet.png"; 
assetsToLoad.push(image); 

//Game states 

var LOADING = 0; 
var BUILD_MAP = 1; 
var PLAYING = 2; 
var OVER = 3; 
var gameState = LOADING; 

// key codes 

var LEFT = 37; 
var RIGHT = 39; 
var SPACE = 32; 

// Directions 

var moveLeft = false; 
var moveRight = false; 





window.addEventListener("keydown", function(event) { 
    switch(event.keyCode) 
    { 
     case LEFT: 
      moveLeft = true; 
      break; 

     case RIGHT: 
      moveRight = true; 
      break; 

      }}, false); 

window.addEventListener("keyup", function(event) { 
    switch(event.keyCode) 
    { 
     case LEFT: 
      moveLeft = false; 
      break; 

     case RIGHT: 
      moveRight = false; 
      break; 

      }}, false); 

update(); 

function update() { 

    requestAnimationFrame(update, canvas); 

    switch (gameState) { 
     case LOADING: 
      console.log("loading..."); 
      break; 

     case BUILD_MAP: 
      buildMap(map); 
      buildMap(gameObjects); 
      gameState = PLAYING; 
      break; 

     case PLAYING: 
      playGame(); 
      break; 

     case OVER: 
      endGame(); 
      break; 

    } 

    render(); 
} 

function loadHandler() { 
    assetsLoaded++; 
    if (assetsLoaded === assetsToLoad.length) { 
     image.removeEventListener("load", loadHandler, false); 
     gameState = BUILD_MAP; 
    } 
} 

function buildMap(map) { 
    for (var row=0; row < ROWS; row++) { 
     for (var col=0; col < COLS; col++) { 
      var currentTile = map[row] [col]; 
       if (currentTile !== EMPTY) { 


       switch (currentTile) { 

        case GROUND: 
         var ground = Object.create(spriteObject); 
         ground.sourceX = 0; 
         ground.sourceY = 0; 
         ground.x = col * SIZE; 
         ground.y = row * SIZE; 
         sprites.push(ground); 
         break; 

        case TREE_BOTTOM: 
         var treeBottom = Object.create(spriteObject); 
         treeBottom.sourceX = 0; 
         treeBottom.sourceY = 32; 
         treeBottom.x = col * SIZE; 
         treeBottom.y = row * SIZE; 
         sprites.push(treeBottom); 
         break; 

        case TREE_TOP: 
         var treeTop = Object.create(spriteObject); 
         treeTop.sourceX = 0; 
         treeTop.sourceY = 64; 
         treeTop.x = col * SIZE; 
         treeTop.y = row * SIZE; 
         sprites.push(treeTop); 
         break; 

        case SKY: 
         var sky = Object.create(spriteObject); 
         sky.sourceX = 0; 
         sky.sourceY = 96; 
         sky.x = col * SIZE; 
         sky.y = row * SIZE; 
         sprites.push(sky); 
         break; 

        case CLOUD: 
         var cloud = Object.create(spriteObject); 
         cloud.sourceX = 0; 
         cloud.sourceY = 128; 
         cloud.x = col * SIZE; 
         cloud.y = row * SIZE; 
         sprites.push(cloud); 
         break; 

        case CLOUD_LEFT: 
         var cloudLeft = Object.create(spriteObject); 
         cloudLeft.sourceX = 0; 
         cloudLeft.sourceY = 160; 
         cloudLeft.x = col * SIZE; 
         cloudLeft.y = row * SIZE; 
         sprites.push(cloudLeft); 
         break; 

        case CLOUD_RIGHT: 
         var cloudRight = Object.create(spriteObject); 
         cloudRight.sourceX = 0; 
         cloudRight.sourceY = 192; 
         cloudRight.x = col * SIZE; 
         cloudRight.y = row * SIZE; 
         sprites.push(cloudRight); 
         break; 

        case PLATFORM: 
         var platform = Object.create(spriteObject); 
         platform.sourceX = 0; 
         platform.sourceY = 224; 
         platform.x = col * SIZE; 
         platform.y = row * SIZE; 
         sprites.push(platform); 
         platforms.push(platform); 
         break; 

        case CAVE: 
         var cave = Object.create(spriteObject); 
         cave.sourceX = 0; 
         cave.sourceY = 288; 
         cave.x = col * SIZE; 
         cave.y = row * SIZE; 
         sprites.push(cave); 
         break; 

        case EGG: 
         var egg = Object.create(spriteObject); 
         egg.sourceX = 0; 
         egg.sourceY = 256; 
         egg.x = col * SIZE; 
         egg.y = row * SIZE; 
         sprites.push(egg); 
         eggs.push(egg); 
         break; 

        case MEAT: 
         var meat = Object.create(spriteObject); 
         meat.sourceX = 0; 
         meat.sourceY = 320; 
         meat.x = col * SIZE; 
         meat.y = row * SIZE; 
         meat.visible = false; 
         sprites.push(meat); 
         break; 

        case DINO: 
         var dino = Object.create(spriteObject); 
         dino.sourceX = 0; 
         dino.sourceY = 416; 
         dino.x = col * SIZE; 
         dino.y = row * SIZE; 
         sprites.push(dino); 
         dinos.push(dino); 
         break; 

        case GUARD: 
         var guard = Object.create(spriteObject); 
         guard.sourceX = 0; 
         guard.sourceY = 480; 
         guard.x = col * SIZE; 
         guard.y = row * SIZE; 
         sprites.push(guard); 
         break; 

        case MAN: 
         var man = Object.create(spriteObject); 
         man.sourceX = 0; 
         man.sourceY = 352; 
         man.x = col * SIZE; 
         man.y = row * SIZE; 
         sprites.push(man); 
         break; 
       } 
      } 
     } 
    } 
} 



function playGame() { 

    if (moveLeft && !moveRight) { 
     man.vx = -3; 
    } 

    if (moveRight && !moveLeft) { 
     man.vx = 3; 
    } 

    if (!moveLeft && !moveRight) { 
     man.vx = 0; 
    } 

    man.x += man.vx; 

} 

function endGame() { 

} 

function render() { 
    drawingSurface.clearRect(0, 0, canvas.width, canvas.height); 

    if (sprites.length !== 0) { 
     for (i=0; i < sprites.length; i++) { 
      var sprite = sprites[i]; 
      if (sprite.visible) { 
       drawingSurface.drawImage (
        image, 
        sprite.sourceX, sprite.sourceY, 
        sprite.sourceWidth, sprite.sourceHeight, 
        Math.floor(sprite.x), Math.floor(sprite.y), 
        sprite.width, sprite.height 
       ); 
      } 
     } 
    } 
} 

Answer 1

그것을 참조하려고 여기서. 따라서 playGame 함수는이를 "볼"수 없습니다.

이 문제를 해결하려면 buildMap 함수 (바로 앞에, 바람직하게는) 외부에 변수 ("var man;"을 넣음)를 선언하십시오.

Answer 2

내가 .... 당신이 기능을 "을 buildMap"

로컬 변수 "사람"선언되는 코드를보고 생각하고 다른 기능에 액세스하려고 즉. "PlayGame을"..

는

당신이 이 작동 희망 스크립트의 최상위 라인에 ... 그것은 글로벌하여 그것을 해결할 수 있습니다 ... 이것이 문제가 될 수있다.