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

最新推荐文章于 2023-04-02 13:03:27 发布

陈小聪-小虎Oni

最新推荐文章于 2023-04-02 13:03:27 发布

阅读量879

点赞数

分类专栏： JavaScript挑战编程技能文章标签：小虎Oni 小虎 javascript oniplan

本文链接：https://blog.csdn.net/onil_chen/article/details/67703329

版权

原创同时被 3 个专栏收录

72 篇文章 0 订阅

订阅专栏

javascript

32 篇文章 0 订阅

订阅专栏

JavaScript挑战编程技能

9 篇文章 3 订阅

订阅专栏

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

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

1、如果只包含数字，则为非常弱的密码。

2、如果只包含字母，则为弱密码。

3、如果包含字母，至少有一个数字，并且字数不少于8个字符，则为强密码。

4、如果包含字母、数字和特殊字符，兵器字数不少于8字，则为非常强的密码。

要求：

1、创建passwordValidator函数，以密码为参数，返回一个可以帮助我们评估密码强度的值。不要让函数返回字符串，未来可能需要支持多种语言。

2、使用单条输出语句。

3、实时以图形和文字形式提供反馈。当用户输入一个密码时，确定其强度并显示结果。

代码实现如下，具体算法看注释

<body>
<div>
<input  id="inputString" type="text" placeholder="请输入密码" style="display: inline-block" οnkeyup="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,希望你开心.

陈小聪-小虎Oni

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript挑战编程技能-第六题：检查密码强度

函数可以帮助我们抽象掉负责操作，还可以帮助我们构建可复用的组件。开发一个程序，基于如下规则确定给定密码的强度。1、如果只包含数字，则为非常弱的密码。2、如果只包含字母，则为弱密码。3、如果包含字母，至少有一个数字，并且字数不少于8个字符，则为强密码。4、如果包含字母、数字和特殊字符，兵器字数不少于8字，则为非常强的密码。要求：1、创建passwordValidator函
复制链接

扫一扫