2016-05-12 82 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>