Javascript 比较单词中的字母时不区分大小写

Question

我有这个练习，用户输入一个单词然后输入一个字母以查看该字母在该单词中出现了多少次。该项目的这一部分工作得很好。但是，我想让它不区分大小写，因为现在不是。我想为大写字母创建一个变量，为小写字母创建一个变量，然后将这两个变量与 i 或 letter 变量进行比较就可以了。然而，它使计数器在单词中找到的字母数量加倍。有人能帮我吗？这是我的代码：

function checkWordAndLetter() {
  var userWord = $("#word").val();
  console.log(userWord);
  var userLetter = $("#letter").val();
  console.log(userLetter);
  var letterUpperCase = userLetter.toUpperCase();
  var letterLowerCase = userLetter.toLowerCase();
  var tally = 0;
  for (i = 0; i < userWord.length; i++) {
    if (userLetter == userWord[i] && i == letterUpperCase ||
      letterLowerCase) {
      tally++;
    }
  }
  console.log(tally);
  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s  in the word " + userWord);
  console.log("apple");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mainPage">
  <h2>Find the Letter in the Word</h2>
  <h4>Enter a word and select a letter to see how many times that letter appears in the word</h2>
    <p>Enter below:</p>
    <br/> Word:
    <input id="word" type="text" name="word"><br/><br/> Letter: <input id="letter" type="text" name="letter"><br/><br/>
    <br/>
    <br/>
    <button id="submit" type="button" name="submit" onclick="checkWordAndLetter()">submit</button>
    <p id="letterResults"></p>
</div>

Answer 1

此处最简单的选择，无需更改其余代码，就是大写（或小写）两边等式，所以你在比较同类。

function checkWordAndLetter() {
  var userWord = $("#word").val();
  var userLetter = $("#letter").val();
  var userWordUpper = userWord.toUpperCase();
  var userLetterUpper = userLetter.toUpperCase();
  var tally = 0;
  for (var i = 0; i < userWord.length; i++) {
    if (userLetterUpper == userWordUpper[i]) {
      tally++;
    }
  }
  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s in the word " + userWord);
}
$("#word,#letter").change(checkWordAndLetter)

checkWordAndLetter();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='word' value='hello'/>
<input type='text' id='letter' value='l' />
<div id='letterResults'></div>

在您的原始代码中，这一行：

if (userLetter == userWord[i] && i == letterUpperCase || letterLowerCase) {

可能是：

if (letterUpperCase == userWord[i] || letterLowerCase == userWord[i]) {

另一种选择可能是使用 .split()，它通过在指定字符处断开将字符串分隔到一个数组中。通常这将是 ,，但您可以使用任何字母：

var tally = userWordUpper.split(userLetterUpper).length - 1;

function checkWordAndLetter() {
  var userWord = $("#word").val();
  var userLetter = $("#letter").val();

  var userWordUpper = userWord.toUpperCase();
  var userLetterUpper = userLetter.toUpperCase();

  var tally = userWordUpper.split(userLetterUpper).length - 1;

  $("#letterResults").html(" There are " + tally + " " + userLetter + "'s in the word " + userWord);
}
$("#word,#letter").change(checkWordAndLetter)

checkWordAndLetter();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='text' id='word' value='hello' />
<input type='text' id='letter' value='l' />
<div id='letterResults'></div>

另一个选项将用于正则表达式（编辑：参见 Rory 的回答，无需在此处重复）- 正则表达式的好处是您无需先转换为 upper/lower。

Answer 2

如果您想计算一个字母在不区分大小写的单词中出现的次数，请在遍历单词之前将单词和小写。通过这种方式，您将比较相同的字母。示例：

let tally = 0;
let letter = "a";
let word = "cAaatttt";
word = word.toLowerCase();
letter = letter.toLowerCase();
for (let i = 0; i < word.length; i++) {
    if (word[i] === letter) tally++;
}

Answer 3

要使用当前代码执行您需要的操作，就是将单词和字母字符串转换为匹配大小写，然后进行比较。您可以使用 toLowerCase() 或 toUpperCase() 来做到这一点。

但是，您可以通过创建正则表达式并使用不区分大小写标志 (i) 和 match() 来进一步简化代码，如下所示：

$('#submit').click(function() {
  var userWord = $("#word").val();
  var userLetter = $("#letter").val();
  
  var re = new RegExp(userLetter, 'gi');
  var tally = userWord.match(re).length;
  
  $("#letterResults").html(`There are ${tally} ${userLetter}'s  in the word ${userWord}`);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mainPage">
  Word: <input id="word" type="text" name="word"><br/><br/> 
  Letter: <input id="letter" type="text" name="letter"><br/><br/>
  <button id="submit" type="button" name="submit">submit</button>
  <p id="letterResults"></p>
</div>

另请注意，这里使用了一个不显眼的事件处理程序，而不是过时的 on* 事件属性，您应该避免使用它。

Answer 4

将单词转为小写并使用小写字母进行校验。你不需要做 uppercase === letter || lowercase === letter。正如其他人已经指出的那样，另一个问题是您的 if 语句。

您也可以在一行中为此使用 RegExp：

const letter = 'a'
const word = 'pizza potatoes and hamburgers'
const reg = new RegExp(letter, 'gi')
const count = (word.match(reg) || []).length // 4, 0 if no letters found

Javascript 比较单词中的字母时不区分大小写

Javascript case insensitive when comparing a letter in a word

javascript

jquery

for-loop

case-insensitive