输入单词时alert弹窗出现NaN错误，成功消息值正常的问题排查

当输入单词时，alert弹窗会显示NaN错误，但成功消息能够展示正确的数值。其中points和totalPoints变量是在函数作用域外部声明的。

原代码 #

var wordList = ["jalapeno", "nopal", "jalap", "paeon", "panel", "pelon", "penal", "plena", "pleon", "plane"]
var wordInput = $('#word-input');
var totalPoints = 0; // 初始化总积分变量
var points = 0;

var notEmpty = function(message) {
  $('.sb-message-box').addClass('error-message').text(message);
  setTimeout(function() {
    $('#word-input').val('');
    $('.sb-message-box').removeClass('error-message').text('');
  }, 1000);
}

var hasError = function(message) {
  $('.sb-message-box').addClass('error-message').text(message);
  $('.sb-hive-input-content').addClass('has-error').text(message);
  setTimeout(function() {
    $('#word-input').val('');
    $('.sb-hive-input-content').removeClass('has-error').text('');
    $('.sb-message-box').removeClass('error-message').text('');
  }, 1000);
}

var successMessage = function(message) {
  $('.sb-message-box').addClass('success-message').text(message);
  $('.sb-message-box').addClass('sb-message').text(message);
  $('.sb-hive-input-content').addClass('isAccepting').text();
  setTimeout(function() {
    $('#word-input').val('');
    $('.sb-message-box').removeClass('success-message').text('');
    $('.sb-message-box').removeClass('sb-message').text('');
    $('.sb-hive-input-content').removeClass('isAccepting').text();
  }, 1000);
}

// 定义enter-btn的点击事件
$('#enter-btn').click(function() {

  var word = wordInput.text().trim();
  var centerLetter = $('.hive-cell.center .cell-letter').text();

  console.log(word)


  // 条件判断
  if (word.trim().length === 0) {
    notEmpty('Enter a word');

  } else if (word.length <= 3) {
    $('.sb-hive-input-placeholder').text(word);
    hasError('Too short');

  } else if (word.indexOf(centerLetter) === -1) {
    $('.sb-hive-input-placeholder').text(word);
    hasError('Missing center letter');

  } else if (word.length > 3 && !wordList.includes(word.toLowerCase())) {
    $('.sb-hive-input-placeholder').text(word);
    hasError('Not in word list');

  } else if (wordList.includes(word.toLowerCase()) && !result.includes(word.toLowerCase())) {

    // 获取单词的字母数量
    var letterCount = word.length;
    if (letterCount === 4) {
      points = 1;
      successMessage('Good! ' + points + 'point.');
    } else if (letterCount === 5) {
      points = 5;
      successMessage('Good! ' + letterCount + ' points.');
    } else if (letterCount === 6) {
      points = 6;
      successMessage('Good! ' + letterCount + ' points.');
    } else if (letterCount === 7) {
      points = 7;
      successMessage('Good! ' + letterCount + ' points.');
    } else if (letterCount === 8) {
      // 检查是否是全字母词（pangram）
      points = 15;
      successMessage('Got a pangram! 15 points!');
    } else {
      successMessage('Good! ' + letterCount + ' letters. Keep going!');
    }
    alert(points);
    console.log(points);
    totalPoints = totalPoints + points;
  }
});

    // 创建并设置Cookie
    function setCookie(cookieName, cookieValue, daysToExpire, path) {
        var date = new Date();
    
        date.setTime(date.getTime() + (daysToExpire * 24 * 60 * 60 * 1000));
        document.cookie = cookieName + "=" + JSON.stringify(cookieValue) + "; expires=" + date.toGMTString() + ";   path=" + path ;
        console.log("setCookieValue: " + JSON.stringify(cookieValue));
    }
    
    setCookie('Result', result, 1, '/');

问题原因 #

1. points变量未全分支赋值：当输入的单词长度不在4-8范围内时，代码进入最后一个else分支，此时没有给points变量赋值。如果之前的points因意外操作变成NaN（比如之前的错误计算），就会导致alert弹窗显示NaN。
2. result变量未声明：代码中使用了result.includes()但未提前声明result变量，这会导致未定义错误，可能间接影响变量的正常赋值。
3. 输入值获取方式错误（潜在问题）：如果#word-input是input表单元素，使用text()无法获取输入值，应该用val()，这可能导致部分场景下word值异常。

修复方案 #

1. 给所有分支的points赋值：在最后一个else分支中添加points的赋值逻辑，比如按字母数量设置分数：

   else {
     points = letterCount; // 或者根据需求设置默认分数，比如0
     successMessage('Good! ' + letterCount + ' letters. Keep going!');
   }
   

2. 声明result变量：在全局作用域添加result数组的声明，用于存储已提交的有效单词：

   var result = [];
   

3. 修正输入值获取方式：如果#word-input是input元素，将text()改为val()：

   var word = wordInput.val().trim();
   

内容的提问来源于stack exchange，提问作者Akhil Rana