NaN 问题 - 为什么相同的代码返回不同的结果？答案

【问题标题】：NaN Issue - Why does identical code returns diffrent results?NaN 问题 - 为什么相同的代码返回不同的结果？
【发布时间】：2017-10-17 19:05:02
【问题描述】：

我正在编写一个脚本，以将加扰的单词与未加扰的单词进行匹配，但我遇到了一个奇怪的 NaN 问题。我在下面插入了 cmets 以指导您进一步了解我的问题，希望您可以解释为什么会发生此问题。感谢您的时间和帮助。

注意：完全相同（但变量名不同）的两段代码行为不同。后者有效，但前者无效。

<!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
字[1]：121212 - 值：297
...省略列表的其余部分...
typeof wordVals[0]?: number
isInteger wordVals[0]?: false
Scram Word[0]：leho!l - 值：565
Scram Word[1]：lilwie - 值：646
...省略列表的其余部分...

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

我不明白为什么第一个代码块实际上与第二个可以工作的代码块完全相同！

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

我是一个初学者，并意识到这不是寻找单词匹配的正确方法。正则表达式可能是我最终会尝试使用的，但我需要弄清楚这一点，这样我才能在学习的方式上取得进步。

谢谢。我一直使用这个网站，因为我喜欢你们大多数人在处理用户请求时采取的严肃方法。这里有很多非常聪明的人贡献他们的时间和智慧，我真的很感激。

我也愿意接受您可以给我的任何提示来改进此代码。

【问题讨论】：

标签： javascript arrays ascii nan scramble

【解决方案1】：

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

只需将sum 设置为0，它应该可以按预期工作，例如：

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

【讨论】：

问题解决了！哈哈。谢谢你。这让我发疯了！
@aConvolutedConscious 很高兴我能提供帮助。祝你好运。

【解决方案2】：

对于第一次迭代，您添加一个未定义的数字（即总和）。所以它会变成NaN。使总和= 0；一开始

【讨论】：