JavaScript随机密码生成器持续返回undefined问题求助

核心错误点 #

• promptWindow()从未被调用：用户配置弹窗逻辑完全没执行，finalPassword始终是空数组，取元素时返回undefined，拼接后就是一串undefined。
• 随机索引计算错误：passwordLength是数字类型，没有length属性，passwordLength.length返回undefined，导致randomizer最终为NaN，用NaN访问数组元素必然得到undefined。正确逻辑是基于finalPassword（可选字符池）的长度计算随机索引。
• 密码拼接逻辑错误：randomPassword = +finalPassword[randomizer];用+尝试转换为数字，且每次循环都会覆盖之前的结果，正确写法是用字符串拼接+=。
• 密码长度判断逻辑错误：条件passwordLength <=8 || passwordLength >=128会把合法的8和128判定为无效，应改为passwordLength <8 || passwordLength >128。
• upperCase数组语法错误：最后一个元素后多了逗号，导致数组末尾出现一个undefined元素。

修正后的完整代码 #

// Assignment Code
let passwordLength = 8;
const generateBtn = document.querySelector("#generate");
let finalPassword = [];
const lowerCase = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
const upperCase = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
const characters = ['!', '@', '#', '$', '%', '^', '&', '*', '(', ')', '-', '_', '+', '=', ',', '.', '?', '<', '>', '?'];
const numbers = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0']; // 补充原数组缺失的0

// Write password to the #password input
generateBtn.addEventListener("click", writePassword);

function writePassword() {
  // 先调用配置弹窗，确认配置有效再生成密码
  const isValid = promptWindow();
  if (!isValid) return;
  
  const password = generatePassword();
  const passwordText = document.querySelector("#password");
  passwordText.value = password;
}

function generatePassword() {
  let randomPassword = "";
  const poolLength = finalPassword.length;
  // 确保字符池不为空
  if (poolLength === 0) return "";
  
  for (let i = 0; i < passwordLength; i++) {
    const randomizer = Math.floor(Math.random() * poolLength);
    randomPassword += finalPassword[randomizer];
  }
  return randomPassword;
}

function promptWindow() {
  finalPassword = [];
  passwordLength = parseInt(prompt("Select a password length between 8 - 128 characters"));

  if (isNaN(passwordLength) || passwordLength < 8 || passwordLength > 128) {
    alert("WARNING! Invalid password length entered");
    return false;
  }
  
  // 补充原代码缺失的小写字母选择逻辑
  if (confirm("Include lowercase letters in password?")) {
    finalPassword = finalPassword.concat(lowerCase);
  }
  if (confirm("Include uppercase letters in password?")) {
    finalPassword = finalPassword.concat(upperCase);
  }
  if (confirm("Include special characters in password?")) {
    finalPassword = finalPassword.concat(characters);
  }
  if (confirm("Include numbers in password?")) {
    finalPassword = finalPassword.concat(numbers);
  }
  
  // 确保至少选择一种字符类型
  if (finalPassword.length === 0) {
    alert("You must select at least one character type!");
    return false;
  }
  
  return true;
}

额外优化说明 #

• 补充了小写字母的选择弹窗，原代码仅定义数组但未提供用户选择入口。
• 给numbers数组补充了0，修复原数组缺少数字0的问题。
• 增加了字符池非空校验，防止用户未选择任何字符类型时生成空密码。
• 将全局变量改为let/const，符合现代JavaScript语法规范。

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