나는 자바 스크립트에 새로 온 사람과 내가

Question

I keep getting this error and I'm not sure what to do? I'm trying to make a flip card game. Uncaught TypeError: Cannot read property 'getAttribute' of undefined at flipCard (main.js:42) at createBoard (main.js:53) at main.js:59

var cards = [ 
    { 
    rank: 'queen', 
    suit: 'diamonds', 
    cardImage: 'images/queen-of-diamonds.png' 
    }, 
    { 
    rank: 'queen', 
    suit: 'hearts', 
    cardImage: 'images/queen-of-hearts.png' 
    }, 
    { 
    rank: 'king', 
    suit: 'diamonds', 
    cardImage: 'images/king-of-diamonds.png' 
    }, 
    { 
    rank: 'king', 
    suit: 'hearts', 
    cardImage: 'images/king-of-hearts.png' 
    } 
    ] 
    var cardsInPlay = [cards] 
    var checkForMatch = function() { 
    this.cardImage.setAttribute(src) 
    if (cardsInPlay[0] === cardsInPlay[1]) { 
    window.alert('You found a match!') 
    } else { 
    window.alert('Sorry, try again') 
    } 
    } 

var flipCard = function (cardId) { 
this.cardId.getAttribute('data-id') 
checkForMatch() 
console.log('User flipped ' + cards[cardId].rank) 
console.log('User flipped ' + cards[cardId].cardImage) 
console.log('User flipped ' + cards[cardId].suit) 
} 
function createBoard() { 
for (var i = 0; i < cards.length; i++) { 
var cardElement = document.createElement('img') 
cardElement.setAttribute('src', 'images/back.png') 
cardElement.setAttribute('data-id', i) 
cardElement.addEventListener('click', flipCard()) 
cardElement.appendChild(game-board) 
} 
} 
createBoard() 
cardsInPlay.push(cards[cardId])` 

Answer 1

여기에 잘못된 어디 알아 내기 위해 노력하고있어 : 당신이 플립 카드를 호출하고

cardElement.addEventListener('click', flipCard()) 

보다는 함수 참조를 전달합니다. 그것이 글로벌 공간에 정의 된 바와 같이, checkForMatch에서 this 값이있을려고하고 있지 않다 이에 따라

var flipCard = function(cardId) { 
    //no need of 'this' here 
    cardId.getAttribute('data-id') 
    checkForMatch() 
    console.log('User flipped ' + cards[cardId].rank) 
    console.log('User flipped ' + cards[cardId].cardImage) 
    console.log('User flipped ' + cards[cardId].suit) 
} 

function createBoard() { 
    for (var i = 0; i < cards.length; i++) { 
    var cardElement = document.createElement('img') 
    cardElement.setAttribute('src', 'images/back.png') 
    cardElement.setAttribute('data-id', i) 
    cardElement.addEventListener('click', flipCard.bind(null, cardElement)) 
    cardElement.appendChild(game-board) 
    } 
} 

Answer 2

코드를 변경하려고하면 직접 요구하고있다. call : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call

checkForMatch.call(this); 

을 사용하여 전화 할 수도 있습니다.