函数可以帮助我们抽象掉负责操作,还可以帮助我们构建可复用的组件。
开发一个程序,基于如下规则确定给定密码的强度。
1、如果只包含数字,则为非常弱的密码。
2、如果只包含字母,则为弱密码。
3、如果包含字母,至少有一个数字,并且字数不少于8个字符,则为强密码。
4、如果包含字母、数字和特殊字符,兵器字数不少于8字,则为非常强的密码。
要求:
1、创建passwordValidator函数,以密码为参数,返回一个可以帮助我们评估密码强度的值。不要让函数返回字符串,未来可能需要支持多种语言。
2、使用单条输出语句。
3、实时以图形和文字形式提供反馈。当用户输入一个密码时,确定其强度并显示结果。
代码实现如下,具体算法看注释
<body> <div> <input id="inputString" type="text" placeholder="请输入密码" style="display: inline-block" onkeyup="keyupFunc()"> <span id="outText" style="display: inline-block;color:white"></span> </div> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script> <script> var spancolor = [ { color: '#FF0000', text: '非常弱' }, { color: '#FFB5B5', text: '弱' }, { color: '#0000C6', text: '强' }, { color: '#53FF53', text: '非常强' } ]; function analizeCharacter(char) { var code = char.charCodeAt(0); if(code >= 48 && code <= 57) return 1; // 数字 if((code >= 97 && code <= 122)||(code >= 65 && code <= 90)) return 2; // 字母 return 4; // 特殊字符 和标点符号 }; function passwordValidator(psw){ if(psw%1 === 0){//这里利用了js弱语言类型会自动转换的特性 return 0;//纯数字,为非常弱密码 } var score = 0; var hasForeign = false; for(var i = 0;i < psw.length;i++) { score += analizeCharacter(psw[i]); if(analizeCharacter(psw[i]) === 4){ hasForeign = true; } } if(score === psw.length*2 && !hasForeign || psw.length < 8){ return 1;//纯字母或长度小于8,为弱密码 }else if(!hasForeign){ return 2;//字母带数字,为强密码 }else{ return 3; } } function keyupFunc(){ var inputString = $('#inputString').val(); $("#outText").text(spancolor[passwordValidator(inputString)].text); $("#outText").css('background-color', spancolor[passwordValidator(inputString)].color); } </script> </body>
运行结果:
第六节课就到这里结束了吧,
谢谢你的阅读.
有什么问题可以直接联系我本人微信:yu_xiaohu
希望大家关注我的个人公众号,有更新会在上面同步发布哦.
我是小虎Oni,希望你开心.