如何用JavaScript实现密码强度检测？

密码强度检测需同时验证长度≥8、大小写字母、数字、特殊字符四类规则，用独立正则逐项判断并实时反馈强/中/弱等级，前后端均须校验。

密码强度检测的核心是判断输入是否同时满足长度、大小写字母、数字、特殊字符等要求，并给出实时反馈。关键不在于复杂算法，而在于规则清晰、反馈及时、体验自然。

基础规则设定

通常建议至少包含4类字符中的3种，且总长度不少于8位。可按需调整严格度：

• 长度 ≥ 8位
• 含至少1个小写字母（a–z）
• 含至少1个大写字母（A–Z）
• 含至少1个数字（0–9）
• 含至少1个特殊字符（如 !@#$%^&* 等）

用正则逐项验证

每个条件用独立正则判断，逻辑清晰易维护：

function checkPasswordStrength(password) {
  const checks = {
    length: password.length >= 8,
    lowercase: /[a-z]/.test(password),
    uppercase: /[A-Z]/.test(password),
    number: /\d/.test(password),
    special: /[!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?]/.test(password)
  };
const passed = Object.values(checks).filter(Boolean).length;
return {
score: passed,
checks,
strong: passed >= 4 && password.length >= 10,
medium: passed === 3 && password.length >= 8,
weak: passed <= 2
};
}

实时反馈与UI联动

监听 input 事件，在输入时调用检测函数，用颜色或文字提示强度：

• score === 5 → 显示“强”，绿色条
• score ≥ 3 → 显示“中”，橙色条
• score ≤ 2 → 显示“弱”，红色条并高亮未达标项

例如：密码 Ab1! 长度不够，虽含四类字符但只有4位，应提示“长度不足”而非“强度合格”。

避免常见坑点

实际开发中容易忽略的细节：

• 空字符串或纯空格要单独处理（password.trim() === ''）
• 中文、emoji 等 Unicode 字符不影响字母/数字判断，无需额外过滤
• 不要用单个复杂正则匹配全部条件（难读难调，报错定位困难）
• 服务端仍需做相同校验——前端检测仅为体验优化，不可替代后端安全逻辑

基本上就这些。规则可配、反馈要准、前后端别偷懒，密码检测就不复杂但容易忽略细节。