• javascript挑战编程技能第六题:检查密码强度


    函数可以帮助我们抽象掉负责操作,还可以帮助我们构建可复用的组件。

    开发一个程序,基于如下规则确定给定密码的强度。

    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,希望你开心.




  • 相关阅读:
    Javascript--普通函数调用-涨工资计算函数
    Javascript--运算符判断成绩运算
    Javascript-闰年javascript的判断
    Javascript-逻辑判断或(&&)练习
    Javascript-短路 与(&&)
    UVALive6434_Number Assignment
    HDU4811_Ball
    HDU4810_Wall Painting
    HDU4803_Poor Warehouse Keeper
    HDU4802_GPA
  • 原文地址:https://www.cnblogs.com/xiaohuoni/p/7642281.html
Copyright © 2020-2023  润新知