Skip to content

不能说的秘密

作者:江月迟迟
发表于:2024-12-10
字数统计:862 字
预计阅读3分钟

介绍

密码生成器是一个实用的随机密码生成软件,有了它,你就不用绞尽脑汁想复杂的密码来守护你的个人隐私,只要动一下手指,一个新的密码就会生成。

如此好用的工具,下面就让我们亲自动手来制作一个吧~

准备

本题已经内置了初始代码,打开实验环境,目录结构如下:

txt
├── css
│   └── style.css
├── index.html
└── js
    └── generatePassword.js

其中:

  • css/style.css 是样式文件。
  • index.html 是主页面。
  • js/generatePassword.js 是需要补充代码的 js 文件。

选中 index.html 右键启动 Web Server 服务(Open with Live Server),让项目运行起来。

接着,打开环境右侧的【Web 服务】,就可以在浏览器中看到如下效果:

图片描述

目标

请完善 generatePassword.js 中的 generatePassword 函数,实现根据规则随机生成密码的功能。密码长度已由 input 框(id=passwordLength)的属性进行了限制最小 4,最大 20。

  1. 生成的密码必须包含已选中的选项且只能由已选中的选项组成。
  2. 特殊符号如下:!@#$%^&*(){}[]=<>/,.
  3. 本题封装方法时只需要考虑长度符合要求( 4-20 )且有已选中条件的情况,其他情况无需处理。

完成后,最终页面效果如下:

图片描述

规定

  • 生成的密码必须是随机的。
  • 满足题目需求后,保持 Web 服务处于可以正常访问状态,点击「提交检测」系统会自动判分。

判分标准

  • 本题完全实现题目目标得满分,否则得 0 分。

总通过次数: 469 | 总提交次数: 517 | 通过率: 90.7%

难度: 困难 标签: 2022, 省模拟赛, Web 前端, JavaScript

题解

js
const resultEl = document.getElementById("result");
const lengthEl = document.getElementById("passwordLength");
const uppercaseEl = document.getElementById("uppercase");
const lowercaseEl = document.getElementById("lowercase");
const numbersEl = document.getElementById("numbers");
const symbolsEl = document.getElementById("symbols");
const generateEl = document.getElementById("generate");

generateEl.addEventListener("click", () => {
  const length = +lengthEl.value; // 获取密码长度
  const hasLower = lowercaseEl.checked; // 获取包含小写是否选中
  const hasUpper = uppercaseEl.checked; // 获取包含大写是否选中
  const hasNumber = numbersEl.checked; // 获取包含数字是否选择
  const hasSymbol = symbolsEl.checked; // 获取包含特殊字母是否选中
  // 将随机生成的密码显示到 input 框中
  resultEl.value =
    generatePassword(hasLower, hasUpper, hasNumber, hasSymbol, length) ?? "";
});

/**
 * @function_name generatePassword ->生成密码的函数
 * @param {*} lower 是否小写
 * @param {*} upper 是否大写
 * @param {*} number 是否是数字
 * @param {*} symbol 是否是特殊符号
 * @param {*} length 密码长度
 * @return {*} string
 */
function generatePassword(lower, upper, number, symbol, length) {
  //TODO:待补充代码
  let result = ''
  const random = (str) => str.split('')[Math.random() * str.length | 0]
  const shuffle = (str) => str.split('').sort((a,b) => Math.random() - 0.5).join('')
  while(result.length < length) {
    if(lower) result += random('qwertyuiopasdfghjklzxcvbnm')
    if(upper) result += random("QWERTYUIOPASDFGHJKLZXCVBNM")
    if(number) result += random('1234567890')
    if(symbol) result += random('!@#$%^&*(){}[]=<>/,.')
  }
  return shuffle(shuffle(result.slice(0,length)))
}