JavaScript密码生成器优化：如何替代冗余if语句实现复选框字符选择逻辑

你完全不需要枚举所有复选框的勾选组合，只需要动态拼接可用字符集即可，整体逻辑可以简化到10行以内。

优化思路 #

• 初始化可用字符集为默认的小写字母，符合所有复选框未勾选时仅用小写的规则
• 提前获取三个复选框的勾选状态，避免重复查询DOM
• 依次判断每个复选框是否勾选，勾选就将对应字符集合并到可用字符集中
• 最后统一调用一次GeneratePassword方法生成密码

优化后代码 #

// 提前获取复选框状态，避免重复查询DOM
const useCaps = document.getElementById('caps').checked;
const useNumbers = document.getElementById('numbers').checked;
const useSymbols = document.getElementById('symbols').checked;

// 初始化基础字符集为小写字母
let charsArray = [...lowercase];
// 按需拼接其他字符集
if (useCaps) charsArray = charsArray.concat(caps);
if (useNumbers) charsArray = charsArray.concat(numbers);
if (useSymbols) charsArray = charsArray.concat(symbols);

// 统一生成密码
password = GeneratePassword(passwordLength, charsArray);

方案优势 #

• 没有冗余重复代码，完全符合DRY原则
• 扩展性极强，后续如果需要新增字符类型，只需要加一行判断逻辑即可，不需要新增大量分支
• 代码可读性更高，其他开发者一眼就能看懂字符集的拼接逻辑

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