2016-05-12 86 views
2

我工作的一個遊戲:http://codepen.io/abdulahhamzic/pen/xVMXQa複雜的字符串匹配在JavaScript

遊戲由玩家猜一個字,他們只有五次嘗試猜它。如果玩家字中的一個字母在適當的位置,那麼它應該變成綠色。如果字中有一個字母,但不是在正確的地方,它應該塗成紅色,以提示玩家該字母是否存在,但應該放在字詞的其他位置。我用這部分代碼來實現該功能:

if (userWord[i].toUpperCase() == word[i]){ 
    document.getElementsByClassName("letters")[input].children[i].style.background = "green"; 
} 
else if (word.indexOf(userWord[i].toUpperCase()) > -1){ 
    document.getElementsByClassName("letters")[input].children[i].style.background = "red"; 
}  

的問題是,當玩家輸入一個包含兩個或兩個以上相同的字母的單詞正確的字包含更少的那封信的,只有那封信在確切的地方應該是綠色的,而其他字母不應該是紅色的,因爲這意味着該信件有多次。例如:

  • 如果字是「ABBBB」和玩家進入「AAAAC」,只有「AAAAC」的第一個「A」應保持綠色和其他的「A」的應保持黃色,而不是變紅。
  • 如果單詞是「ABABB」,玩家輸入「ACBAA」,則第一個「A」應該保持綠色,只有第二個「A」應該是紅色,而不是最後一個「A」這個詞裏只有兩個「A」。另外,「B」當然應該是紅色的。
  • 如果單詞是「ABABA」並且玩家輸入「AAAAA」,那麼只有第一個,第三個和最後一個「A」應該是綠色的,但其他「A」應該保持黃色而不是變紅。

所以,這些都是一些例子。我想你現在已經明白了。我真的無法弄清楚如何正確實現這個功能。

+0

@野生寡婦我認爲社會意外刪除您的修改建議後,我做了一個真的很小一個......我們對此深感抱歉,我會嘗試讓他們現在... – webeno

+0

@Abdulah我已刪除你的問題中的一些我認爲沒有意義的文字是相關的,如果我有點過於嚴格,抱歉,你可以按你認爲合適的方式回覆它。在你就不同問題提出不同問題的問題上,我認爲這是最好的方法;在同一個問題中詢問所有問題會使其非常混亂,並且可能最終因此而關閉...... – webeno

+0

黃色的條件是什麼? –

回答

1
  1. 放置猜到字並在散列表中的期望的字(對象),其中的字母頻率進行計數

例2:

actualWord = { a: 2, b: 3} 
    guessedWord = { a: 3, b: 1, c: 1} 
  • 經過每次猜測後,同時遍歷兩個字符串

  • 如果您在墊上的字母因爲它既是正確的字母也是正確的地方,所以你會突出顯示綠色。

  • 遞減在哈希表中兩個值(它們匹配,不再考慮)

    actualWord = { a: 1, b: 3} 
    guessedWord = { a: 2, b: 1, c: 1} 
    
  • 如果它們不匹配,檢查哈希表。如果猜到的字母在實詞的散列表中,則存在,但它位於錯誤的地方。突出顯示它紅色。通過一個

    actualWord = { a: 0, b: 3} 
    guessedWord = { a: 1, b: 1, c: 1} 
    
  • 如果查找作品遞減兩種,但實際的字的哈希值是0,你知道用戶輸入了太多相同的字母,所以你會變成黃色。(我認爲)

  • 0

    我有一個解決方案給你。

    首先檢查信件是否在正確的地方。

    然後處理另一封信。

    每發現一個字母增加一個特定字母的計數器。 因此,每次你可以檢查你是否已經找到了這封信。

    var target= "aabccd".toLowerCase(); 
     
    var guess = prompt("guess the word(6 Letters)","").toLowerCase(); 
     
    
     
    function countLetter(letter, string) 
     
    { 
     
        var count = 0, n = 0, i = 0; 
     
        
     
        while((i = string.indexOf(letter, n)) != -1) 
     
        { 
     
         n += i + 1; 
     
         count++; 
     
        } 
     
        return count; 
     
    } 
     
    
     
    var guessLetterCount = {}; 
     
    var style = []; 
     
    for(var i = 0; i < target.length; i++) 
     
        style.push("yellow"); 
     
    
     
    // get letter who match 
     
    for(var i = 0; i < target.length; i++) 
     
    { 
     
        if(target[i] == guess[i]) 
     
        { 
     
        style[i] = "green"; 
     
        if(guessLetterCount[target[i]]) 
     
          guessLetterCount[target[i]]++; 
     
        else 
     
          guessLetterCount[target[i]] = 1; 
     
        } 
     
    } 
     
    
     
    // get letter at the wrong place 
     
    for(var i = 0; i < target.length; i++) 
     
    { 
     
        // only process letter who aren't at the right place 
     
        if(style[i] == 'yellow') 
     
        { 
     
        // check if letter match and compare the letter count 
     
        if(target.indexOf(guess[i]) != -1 && (guessLetterCount[guess[i]] == null || countLetter(guess[i], target) > guessLetterCount[guess[i]])) 
     
        { 
     
         // set read background 
     
         style[i] = "red"; 
     
         if(guessLetterCount[guess[i]]) 
     
         guessLetterCount[guess[i]]++; 
     
         else 
     
         guessLetterCount[guess[i]] = 1; 
     
        } 
     
        } 
     
    } 
     
    
     
    // write result 
     
    for(var i = 0; i < target.length; i++) 
     
    { 
     
        document.write('<span style="font-size:20px; background:' + style[i] + '">'+guess[i]+'</span>'); 
     
        
     
    }

    +0

    如果我當前的代碼無法正常工作,我會嘗試此操作。謝謝! –

    +0

    我想我們只是爲他們做了一些作業,西蒙。 –

    0

    Here's your working answer.注意測試字是標題爲 '字' 和在本示例中,變量是VAR字= 'AABBCC';

    <!DOCTYPE html> 
    <html lang="en-us"> 
    
    <head> 
        <meta charset="utf-8"> 
        <title>js</title> 
        <style type="text/css"> 
         .green{ 
          color:green; 
         } 
         .red{ 
          color:red; 
         } 
        </style> 
    </head> 
    <body> 
        <input type="text" id="input"></input> 
        <div id="result"></div> 
        <script> 
         var doc = document; 
         var word = 'AABBCC'; 
         var input = doc.getElementById('input'); 
         var result = doc.getElementById('result'); 
         var inputArray = []; 
         var colorArray = []; 
    
         input.addEventListener("keyup", function() { 
          //clear result div and capture the string in the textbox 
          var inputValue = input.value.toUpperCase(); 
          result.innerHTML = ''; 
    
          //wrap each character of the string in a <span> 
          for (var i = 0; i < inputValue.length; i++) { 
           var newSpan = document.createElement('span'); 
           var t = document.createTextNode(inputValue.charAt(i)); 
           newSpan.appendChild(t); 
           result.appendChild(newSpan); 
    
           //capture each letter in an array 
           inputArray[i] = inputValue.charAt(i); 
          } 
    
          //get position of last character 
          var position = inputValue.length - 1; 
          var thisChar = inputValue.charAt(position); 
          var wordChar = word.charAt(position);    
          console.log('this char is ' + thisChar + ' and index is ' + position + ' and inputArray is ' + inputArray); 
    
          var green = (thisChar === wordChar); 
          var red = remains(thisChar,position);   
    
          if(green){ 
           colorArray[position] = 'green'; 
          } else if (red){ 
           colorArray[position] = 'red'; 
          } else { 
           colorArray[position] = ''; 
          } 
          color(); 
         });  
    
         function color(i, color){ 
          var children = result.childNodes; 
          for (var i = 0; i < children.length; i++) { 
           children[i].className = colorArray[i]; 
          } 
         } 
    
         function remains(char,n){ 
          var found = false; 
          //get the remaining substring of word to compare to 
          var subString = word.substring(n); 
          //if character is found return true 
          for (var i = 0; i < subString.length; i++) { 
           if(char === subString.charAt(i)){ 
            found = true; 
           } 
          } 
          return found; 
         } 
        </script> 
    
    </body> 
    </html>