javascriptで関数を初期化する

Question

ランダムなカードをいくつか作成する関数を作成しましたが、init（1）のように呼び出すとInit関数が未定義を返します。それはなぜ機能しないのですか？以下のように、それは次のようになります。私は、例えば、初期化のための関数を呼び出してい 1.（1） 2. initは作成され、カードをシャッフルし、身体

// INIT 
 
{ 
 
    function init(difficulty) { 
 
    switch (difficulty) { 
 
     case 1: 
 
      createCards(4); 
 
      break; 
 
     case 2: 
 
      createCards(12); 
 
      break; 
 
     case 0: 
 
      createCards(24); 
 
    } 
 
    } 
 
//FLIP CARD 
 
function createCards(ammount) { 
 
    const gameCards = [] 
 
    for (let i = 0; i < ammount; i++) { 
 
    const gameCard = document.createElement("div"); 
 
    gameCard.className = "card card--click"; 
 
    const gameCardFront = document.createElement("div"); 
 
    const gameCardBack = document.createElement("div"); 
 
    gameCard.appendChild(gameCardFront); 
 
    gameCard.appendChild(gameCardBack); 
 
    gameCardFront.className = "card__front card--reversed"; 
 
    gameCardBack.className = "card__back"; 
 
    const img = new Image(); 
 
    function randImg() { 
 
     const uniqueSrc = {} 
 
     const imgArray = ["ball", "car", "fork", "spoon", "sun"]; 
 
     const gameArray = []; 
 
     for (let i = 0; i < ammount * 2 + 1; i++) { 
 
     const randomSrc = Math.floor(Math.random() * (imgArray.length)); 
 
     if (!uniqueSrc[randomSrc]) { 
 
      uniqueSrc[randomSrc] = randomSrc; 
 
      img.src = "img/" + imgArray[randomSrc] + ".png"; 
 
      img.alt = imgArray[randomSrc]; 
 
      gameArray.push(img); 
 
     } else { 
 
      i--; 
 
     } 
 
     } 
 
     return gameArray; 
 
    } 
 
    randImg(); 
 
    gameCardBack.appendChild(img); 
 
    gameCards.push(gameCard) 
 
    } 
 
    return gameCards; 
 
    } 
 
    const cards = document.querySelectorAll(".card.card--click"); 
 
     //FETCHING ALL CARDS 
 
    for (let i = 0; i < cards.length; i++) { 
 
    const card = cards[i]; 
 
     //ADDING FLIP EFFECT TO EACH CARD 
 
    flipCard(card); 
 
    }; 
 
     //FLIP EFFECT FUNCTION 
 
    function flipCard(card) { 
 
    card.addEventListener("click", function() { 
 
     const list = this.classList; 
 
     list.contains("card--flip") === true ? list.remove("card--flip") : list.add("card--flip"); 
 
    }); 
 
    }; 
 
    function randomizer(array) { 
 
    for (let i = 0; i < array.length; i++) { 
 
     const j = Math.floor(Math.random() * (i + 1)); 
 
     const tmp = array[i]; 
 
     array[i] = array[j]; 
 
     array[j] = tmp; 
 
    } 
 
    return array; 
 
    } 
 
}

Answer 1

1）にそれらを追加しますあなたのカードを身につけていないのです。だから、init関数にカードを返却することもできます。

function init(difficulty) { 
switch (difficulty) { 
    case 1: 
     return createCards(4); 
     break; 
    case 2: 
     return createCards(12); 
     break; 
    case 0: 
     return createCards(24); 
    } 
} 

次に、あなたが身体にinitによって返される配列付加することができます：

init(0).forEach(function(card){ 
    document.body.appendChild(card); 
}); 

2）また、この：

randImg(); 

randImgが配列を返すので意味がないので、それをキャッチしたいかもしれません：

arr=randImg(); 

3）またrandImgが動作しません、あなたはループに

const img=new Image(); 

を配置する必要があります。

4）そして

const cards = document.querySelectorAll(".card.card--click"); 

あなたが前に上記のスニペットを実行しない限り、空のコレクションのだろう...