NaN问题 - 为什么相同的代码会返回不同的结果?

时间:2017-05-18 06:03:55

标签: javascript arrays ascii nan scramble

我正在制作一个脚本,将混乱的单词与他们未解读的对应词匹配,我遇到了一个奇怪的NaN问题。我在下面插入了评论,以指导您进一步了解我的问题,希望您能解释一下为什么会出现这个问题。感谢您的时间和帮助。

注意:完全相同(但具有不同变量名称)的两个代码块的行为不同。后者有效,但前者没有。

<!DOCTYPE html>
<html>

<head>
  <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
  <meta content="utf-8" http-equiv="encoding">
</head>

<body>
  <form id="words">
    <input type="hidden" value="html:),121212,21122112,asdfjkl;,hal9000,1234qwer,1q2w3e,test123,gambit,sports,hello!,willie,hashtags,oneway,whoknows,whyowhy,youwho,theone,sweet!,wo0Oot">
  </form>

  <br>
  <li>leho!l</li>
  <li>lilwie</li>
  <li>thahsags</li>
  <li>yaneow</li>
  <li>kwosonhw</li>
  <li>ohhywwy</li>
  <li>oyuwoh</li>
  <li>otheen</li>
  <li>e!stwe</li>
  <li>wtoO0o</li>


  <script>
    var words, scram, wordVals, scramVals, sum, i, I;

    // Turn word list into an array.
    words = [];
    var words = document.getElementById("words").elements[0].value.split(",");

    // Turn scrambled word list into an array.
    scram = [];
    for (var i = 0; i < 10; i++) {
      scram.push(document.getElementsByTagName("li")[i].innerHTML);
    };

    // Next I iterate through each letter of each word (for the unscrambled words)
    // and convert those letters into ASCII values - adding those together
    // to get the total ASCII value of each word.

    wordVals = [];
    for (i = 0; i < words.length; i++) {
      for (I = 0; I < words[i].length; I++) {
        sum += words[i].charCodeAt(I);
        // console.log(sum)

        // Using console.log(sum), you see that the first 6 iterations return NaN.
        // Each iteration (ASCII Value) for the first word in this loop
        // words[0].charCodeAt(0, 1, 2, 3, 4, 5, 6), all returned NaN.
        // But each word after the first iteration calculates the ASCII values
        // like it's supposed to.
      };
      wordVals.push(parseInt(sum));
      sum = 0;
      console.log("Word[" + i + "]: " + words[i] + " - Value: " + wordVals[i]);
    };

    // typeof WordVals[0] = number
    console.log("typeof wordVals[0]?: " + typeof(wordVals[0]));
    // isInteger = false
    console.log("isInteger wordVals[0]?: " + Number.isInteger(wordVals[0]));

    // Here I am iterating through each letter of each word (for the scrambled words)
    // and converting those letters into ASCII values - adding those values together
    // to get the total ASCII value of each word.
    // **This loop uses the same exact code as the one above (but with different variables)
    // and it works correctly. Why is this?

    scramVals = [];
    for (i = 0; i < scram.length; i++) {
      for (I = 0; I < scram[i].length; I++) {
        sum += scram[i].charCodeAt(I);
      };
      scramVals.push(sum);
      sum = 0;
      console.log("Scram Word[" + i + "]: " + scram[i] + " - Value: " + scramVals[i]);
    };
  </script>
</body>

</html>

输出:

  • Word [0]:html :) - 值:NaN
  • Word [1]:121212 - Value:297
    ...列表的其余部分省略......
  • typeof wordVals [0]?:number
  • isInteger wordVals [0]?:false
  • Scram Word [0]:leho!l - 价值:565
  • Scram Word [1]:lilwie - 价值:646
    ...列表的其余部分省略......

我尝试在单词列表中使用不同的起始单词但获得相同的NaN结果。

我不明白为什么第一个代码块在与第二个代码块完全相同的情况下不起作用!

为什么我在第一个单词的每个字母的ASCII值上得到NaN?

我是初学者,并意识到这不是寻找单词匹配的正确方法。正则表达式可能是我将尝试最终使用的,但我需要弄清楚这一点,以便我可以按照我学习的方式进步。

谢谢。我一直都在使用这个网站,因为我喜欢大多数人在解决用户请求时采取的无意义方法。这里有很多非常聪明的人捐出他们的时间和智慧,我真的很感激。

我也愿意接受您提供的改进此代码的任何提示。

2 个答案:

答案 0 :(得分:4)

这是因为undefined + NumberNaN。最初,sum变量为undefined。这就是为什么wordVals数组中的第一个值为NaN

只需将sum设置为0即可按预期运行,例如:

var words, scram, wordVals, scramVals, sum = 0, i, I;

答案 1 :(得分:1)

对于第一次迭代,您添加一个未定义的数字(即总和)。所以它变成了NaN。使sum = 0;在开头