资讯专栏INFORMATION COLUMN

JavaScript初应用:找到数组中出现最多的字母并给出个数以及每一个所在的位置

Zhuxy / 807人阅读

摘要:刚刚接触一周的时间,熟悉了最基本的知识,这是自己面对的第一个的逻辑性的代码题目,自己尝试了写了,结果还算可以,因为有好多知识涉及到了后面的知识,就有点吃力了。以下代码总结于网上前辈给出的参考答案和结合了自己的理解和注释,请多多指正。

刚刚接触JS一周的时间,熟悉了最基本的js知识,这是自己面对的第一个js的逻辑性的代码题目,自己尝试了写了,结果还算可以,因为有好多知识涉及到了后面的dom知识,就有点吃力了。以下代码总结于网上前辈给出的参考答案和结合了自己的理解和注释,请多多指正。

html代码:


    

找到数组中出现最多的字母并给出个数以及每一个所在的位置

出现次数最多的字符:

出现次数最多的字符出现的次数:

出现次数最多的字符的索引:

js部分:

function Maxchar(str) { //定义一个参数,代表我们传入一个数组或者字符串(字符串本身来说也是一个数组)
    this.str = str || "";
    this.maxCharMeta = {}; //一个存储提取信息的对象
}
// class_name.prototype.method_name = function(first_argument) {
//     // body...
// };
Maxchar.prototype.parser = function() { //定义一个解析函数,挂在原型上,所有的实例都可以使用
    var str = this.str;
    /*
    objChar= {
        a:{
            char:"a",
            num:3,
            indexs:[2,4,6]
        },
        b:{
            char:"b",
            num:1,
            indexs:[1]
        }
    }
     */
    var objChar = {}, //存储提取的信息
        maxCounter = 0;
    for (var i = 0; i < str.length; i++) { //遍历以后,obj里面就会包含输入字符数组的每个字符的信息了。
        if (objChar[str[i]]) { //若已存在,更新objChar里对应身str[i]的属性值
            objChar[str[i]].num += 1;
            objChar[str[i]].indexs.push(i);
        } else { //若不存在,则代表obj还没有存在字符为str[i]的对象
            //定义一个临时对象
            var metaChar = {
                char: str[i],
                num: 1,
                indexs: [i] //第一次出现,该字符的索引数组里面只有一个元素,即当前的i
            }
            objChar[str[i]] = metaChar; //将临时对象 赋给obj
        }
        // 为了找出最多出现次数的信息,且不再重复定义遍历,就在此for循环中定义实现
        if (maxCounter < objChar[str[i]].num) { //若最大次数小于当前str[i]的num值,就更新
            this.maxCharMeta = objChar[str[i]];
            maxCounter = objChar[str[i]].num;
        }
    }
    return this; //实现链式的调用
}

// 输出
Maxchar.prototype.maxCharInfo = function() {
    return this.maxCharMeta;
}

// 视图处理
// 定义对象
var maxCharOut = {
    inputStr: null, //代表获取的输入值
    parsedObj: null, //代表解析完成的对象
    init: function() { //执行
        this.getStrInfo(); //获取信息
        // this.parser(); //位置放错了:在页面一刷新的时候,还没有获取到值,当鼠标点击以后,才获取到值,开始解析

    },
    getStrInfo: function() { //从界面上获取,利用DOM元素
        var inputStr = document.getElementById("inputStr");
        var calculateBtn = document.getElementById("calculateBtn");

        calculateBtn.onclick = function() { //给button绑定点击事件
            maxCharOut.inputStr = inputStr.value; //在点击的时候获取值
            maxCharOut.parser(); //当鼠标点击以后,才获取到值,开始解析
            maxCharOut.charView(); // 点击时,调用结果输出函数,即可以页面显示结果
        }
    },
    // 解析/计算
    parser: function() {
        // var charMeta =new Maxchar(this.inputStr)  //传入的是一个输入字符(即输入框输入的值)
        // var charMeta =new Maxchar(this.inputStr).parser() //调用 
        // var charMeta =new Maxchar(this.inputStr).parser().maxCharInfo();//输出
        this.parsedObj = new Maxchar(this.inputStr).parser().maxCharInfo();
    },
    // 输出,放到页面上显示
    charView: function() { //显示的三个位置,利用DOM元素
        var maxChar = document.getElementById("maxChar");
        var maxCounter = document.getElementById("maxCounter");
        var strIndex = document.getElementById("strIndex");

        //赋值前先进行判断,parsedObj是否存在,不存在代表解析还未完成
        if (this.parsedObj) {
            maxChar.innerHTML = this.parsedObj.char;
            maxCounter.innerHTML = this.parsedObj.num;
            strIndex.innerHTML = this.parsedObj.indexs.join(","); //关于每个字符的索引数组,不能直接将数组输出,先将其变成字符串
        }
    }
};
// 立即执行函数
(function() {
    maxCharOut.init();
})();

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/49976.html

相关文章

  • JavaScript应用找到数组出现字母给出个数以及一个所在位置

    摘要:刚刚接触一周的时间,熟悉了最基本的知识,这是自己面对的第一个的逻辑性的代码题目,自己尝试了写了,结果还算可以,因为有好多知识涉及到了后面的知识,就有点吃力了。以下代码总结于网上前辈给出的参考答案和结合了自己的理解和注释,请多多指正。 刚刚接触JS一周的时间,熟悉了最基本的js知识,这是自己面对的第一个js的逻辑性的代码题目,自己尝试了写了,结果还算可以,因为有好多知识涉及到了后面的do...

    darkerXi 评论0 收藏0
  • web安全:口令构成分析(python实现)【代码+报告】

    摘要:仅记录文件处理进度结果存储第一列表示口令长度,第二列表示口令数量。,表示口令长度为的口令共有个。第二步逐行遍历原始口令数据集中的每一个口令,首先判断是否是纯口令,如果是纯口令则将其补充或更新到字典中。 国科大web安全技术大作业,分析国内某网站以及yahoo泄露的600万口令,分析其特点...

    luxixing 评论0 收藏0
  • 文字检测识别系统好用吗?都针对什么进行识别?

    摘要:神经网络以上验证码识别都依赖于字符切分,切分的好坏几乎直接决定识别的准确程度。目前验证码识别最先进的是谷歌在识别街景图像中门牌号码中使用的一套的算法。 最近在一个爬虫项目中遇到了验证码,需要机器自动识别绕过。刚好与题主的问题类似,在这里做一些分享。 在网上调研了资料和文献后,分别采用OCR识别和模板库匹配方法对不同类型验证码进行了识别。主要过程可以分解为三个步骤:1.图片清理,2.字符...

    wanglu1209 评论0 收藏0
  • 如何识别图片验证码?

    摘要:图片验证码是目前最常用的一种。神经网络以上验证码识别都依赖于字符切分,切分的好坏几乎直接决定识别的准确程度。目前验证码识别最先进的是谷歌在识别街景图像中门牌号码中使用的一套的算法。 全自动区分计算机和人类的图灵测试(Completely Automated Public Turing test to tell Computers and Humans Apart,简称CAPTCHA),...

    y1chuan 评论0 收藏0
  • 常见大数据和空间面试题

    摘要:答案使用,申请一个长度为类型的,每个位置只表示或,该数组占用空间约。遍历亿个数,当前数为,落在区间,对应。 过滤100亿黑名单 题目 假设有100亿个URL的黑名单,每个URL最多占用64B,设计一个过滤系统,判断某条URL是否在黑名单里。 要求 不高于万分之一的判断失误率;额外内存不超过30GB 答案 100亿个64B的URL需要640GB的内存,显然直接存哈希表不合理。考虑布隆过滤...

    Hydrogen 评论0 收藏0

发表评论

0条评论

阅读需要支付1元查看
<