摘要:好了,其他的不多说的,大家在开发的时候应该知道,有很多常见的实例操作。比如数组去重,关键词高亮,打乱数组等。这些操作,代码一般不会很多,实现的逻辑也不会很难,下面的代码,我解释就不解释太多了,打上注释,相信大家就会懂了。但

1.前言

因为公司最近项目比较忙,没那么多空余的事件写文章了,所以这篇文章晚了几天发布。但是这也没什么关系,不过该来的,总是会来的。

好了,其他的不多说的,大家在开发的时候应该知道,有很多常见的实例操作。比如数组去重,关键词高亮,打乱数组等。这些操作,代码一般不会很多,实现的逻辑也不会很难,下面的代码,我解释就不解释太多了,打上注释,相信大家就会懂了。但是,用的地方会比较,如果项目有哪个地方需要用,如果重复写的话,就是代码冗余,开发效率也不高,复用基本就是复制粘贴!这样是一个很不好的习惯,大家可以考虑一下把一些常见的操作封装成函数,调用的时候,直接调用就好!

源码都放在github上了,大家想以后以后有什么修改或者增加的,欢迎大家来star一下ec-do(https://github.com/chenhuiYj/ec-do)。

2.字符串操作

2-1去除字符串空格

//去除空格  type 1-所有空格  2-前后空格  3-前空格 4-后空格

function trim(str,type){

    switch (type){

        case 1:return str.replace(/\s+/g,"");

        case 2:return str.replace(/(^\s*)|(\s*$)/g, "");

        case 3:return str.replace(/(^\s*)/g, "");

        case 4:return str.replace(/(\s*$)/g, "");

        default:return str;

    }

}

2-2字母大小写切换

/*type

1:首字母大写

2:首页母小写

3:大小写转换

4:全部大写

5:全部小写

* */

//changeCase('asdasd',1)

//Asdasd

function changeCase(str,type)

{

    function ToggleCase(str) {

        var itemText = ""

        str.split("").forEach(

            function (item) {

                if (/^([a-z]+)/.test(item)) {

                    itemText += item.toUpperCase();

                }

                else if (/^([A-Z]+)/.test(item)) {

                    itemText += item.toLowerCase();

                }

                else{

                    itemText += item;

                }

            });

        return itemText;

    }

 

    switch (type) {

        case 1:

            return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {

                return v1.toUpperCase() + v2.toLowerCase();

            });

        case 2:

            return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {

                return v1.toLowerCase() + v2.toUpperCase();

            });

        case 3:

            return ToggleCase(str);

        case 4:

            return str.toUpperCase();

        case 5:

            return str.toLowerCase();

        default:

            return str;

    }

}

2-3字符串循环复制

//repeatStr(str->字符串, count->次数)

//repeatStr('123',3)

//"123123123"

function repeatStr(str, count) {

    var text = '';

    for (var i = 0; i < count; i++) {

        text += str;

    }

    return text;

}

2-4字符串替换

//字符串替换(字符串,要替换的字符,替换成什么)

function replaceAll(str,AFindText,ARepText){

raRegExp = new RegExp(AFindText,"g");

return str.replace(raRegExp,ARepText);

}

2-5替换*

//replaceStr(字符串,字符格式, 替换方式,替换的字符(默认*))

function replaceStr(str, regArr, type,ARepText) {

    var regtext = '', Reg = null,replaceText=ARepText||'*';

    //replaceStr('18819322663',[3,5,3],0)

    //188*****663

    //repeatStr是在上面定义过的(字符串循环复制),大家注意哦

    if (regArr.length === 3 && type === 0) {

        regtext = '(\\w{' + regArr[0] + '})\\w{' + regArr[1] + '}(\\w{' + regArr[2] + '})'

        Reg = new RegExp(regtext);

        var replaceCount = repeatStr(replaceText, regArr[1]);

        return str.replace(Reg, '$1' + replaceCount + '$2')

    }

    //replaceStr('asdasdasdaa',[3,5,3],1)

    //***asdas***

    else if (regArr.length === 3 && type === 1) {

        regtext = '\\w{' + regArr[0] + '}(\\w{' + regArr[1] + '})\\w{' + regArr[2] + '}'

        Reg = new RegExp(regtext);

        var replaceCount1 = repeatSte(replaceText, regArr[0]);

        var replaceCount2 = repeatSte(replaceText, regArr[2]);

        return str.replace(Reg, replaceCount1 + '$1' + replaceCount2)

    }

    //replaceStr('1asd88465asdwqe3',[5],0)

    //*****8465asdwqe3

    else if (regArr.length === 1 && type == 0) {

        regtext = '(^\\w{' + regArr[0] +  '})'

        Reg = new RegExp(regtext);

        var replaceCount = repeatSte(replaceText, regArr[0]);

        return str.replace(Reg, replaceCount)

    }

    //replaceStr('1asd88465asdwqe3',[5],1,'+')

    //"1asd88465as+++++"

    else if (regArr.length === 1 && type == 1) {

        regtext = '(\\w{' + regArr[0] +  '}$)'

        Reg = new RegExp(regtext);

        var replaceCount = repeatSte(replaceText, regArr[0]);

        return str.replace(Reg, replaceCount)

    }

}

2-6检测字符串

//checkType('165226226326','phone')

//false

//大家可以根据需要扩展

function checkType (str, type) {

    switch (type) {

        case 'email':

            return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);

        case 'phone':

            return /^1[3|4|5|7|8][0-9]{9}$/.test(str);

        case 'tel':

            return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);

        case 'number':

            return /^[0-9]$/.test(str);

        case 'english':

            return /^[a-zA-Z]+$/.test(str);

        case 'chinese':

            return /^[\u4E00-\u9FA5]+$/.test(str);

        case 'lower':

            return /^[a-z]+$/.test(str);

        case 'upper':

            return /^[A-Z]+$/.test(str);

        default :

            return true;

    }

}

2-7检测密码强度

//checkPwd('12asdASAD')

//3(强度等级为3)

function checkPwd(str) {

    var nowLv = 0;

    if (str.length < 6) {

        return nowLv

    }

    if (/[0-9]/.test(str)) {

        nowLv++

    }

    if (/[a-z]/.test(str)) {

        nowLv++

    }

    if (/[A-Z]/.test(str)) {

        nowLv++

    }

    if (/[\.|-|_]/.test(str)) {

        nowLv++

    }

    return nowLv;

}

2-8随机码

//count取值范围0-36

 

//randomNumber(10)

//"2584316588472575"

 

//randomNumber(14)

//"9b405070dd00122640c192caab84537"

 

//Math.random().toString(36).substring(2);

//"83vhdx10rmjkyb9"

function randomNumber(count){

   return Math.random().toString(count).substring(2);

}

2-9查找字符串

可能标题会有点误导,下面我就简单说明一个需求,在字符串'sad44654blog5a1sd67as9dablog4s5d16zxc4sdweasjkblogwqepaskdkblogahseiuadbhjcibloguyeajzxkcabloguyiwezxc967'中找出’blog’的出现次数。代码如下

function countStr (str,strSplit){

    return str.split(strSplit).length-1

}

varstrTest='sad44654blog5a1sd67as9dablog4s5d16zxc4sdweasjkblogwqepaskdkblogahseiuadbhjcibloguyeajzxkcabloguyiwezxc967'

//countStr(strTest,'blog')

//6

3.数组操作

3-1数组去重

这个方法是在太多了,我之前写的文章也有提到,我今天这里就写一种之前没用过的方法。

//ES6新增的Set数据结构,类似于数组,但是里面的元素都是唯一的 ,其构造函数可以接受一个数组作为参数

//let arr=[1,2,1,2,6,3,5,69,66,7,2,1,4,3,6,8,9663,8]

//let set = new Set(array);

//{1,2,6,3,5,69,66,7,4,8,9663}

//ES6中Array新增了一个静态方法from,可以把类似数组的对象转换为数组

//Array.from(set)

//[1,2,6,3,5,69,66,7,4,8,9663]

function removeRepeatArray(arr){

    return Array.from(new Set(arr))

}

3-2数组顺序打乱

function upsetArr(arr){

    return arr.sort(function(){ return Math.random() - 0.5});

}

3-3数组最大值最小值

//这一块的封装,主要是针对数字类型的数组

function maxArr(arr){

    return Math.max.apply(null,arr);

}

function minArr(arr){

    return Math.min.apply(null,arr);

}

3-4数组求和,平均值

//这一块的封装,主要是针对数字类型的数组

//求和

function sumArr(arr){

    var sumText=0;

    for(var i=0,len=arr.length;i<len;i++){

        sumText+=arr[i];

    }

    return sumText

}

//平均值,小数点可能会有很多位,这里不做处理,处理了使用就不灵活了!

function covArr(arr){

    var sumText=sumArr(arr);

    var covText=sumText/length;

    return covText

}

3-5从数组中随机获取元素

//randomOne([1,2,3,6,8,5,4,2,6])

//2

//randomOne([1,2,3,6,8,5,4,2,6])

//8

//randomOne([1,2,3,6,8,5,4,2,6])

//8

//randomOne([1,2,3,6,8,5,4,2,6])

//1

function randomOne(arr) {

    return arr[Math.floor(Math.random() * arr.length)];

}

3-6返回数组(字符串)一个元素出现的次数

//getEleCount('asd56+asdasdwqe','a')

//3

//getEleCount([1,2,3,4,5,66,77,22,55,22],22)

//2

function getEleCount (obj, ele) {

    var num = 0;

    for (var i = 0, len = obj.length; i < len; i++) {

        if (ele == obj[i]) {

            num++;

        }

    }

    return num;

}

3-7返回数组(字符串)出现最多的几次元素和出现次数

//arr, rank->长度,默认为数组长度,ranktype,排序方式,默认降序

function getCount(arr, rankranktype){

    var obj = {}, k, arr1 = []

    //记录每一元素出现的次数

    for (var i = 0, len = arr.length; i < len; i++) {

        k = arr[i];

        if (obj[k]) {

            obj[k]++;

        }

        else {

            obj[k] = 1;

        }

    }

    //保存结果{el-'元素',count-出现次数}

    for (var o in obj) {

        arr1.push({elo, countobj[o]});

    }

    //排序(降序)

    arr1.sort(function (n1, n2) {

        return n2.count - n1.count

    });

    //如果ranktype为1,则为升序,反转数组

    if(ranktype===1){

        arr1=arr1.reverse();

    }

    var rank1 = rank || arr1.length;

    return arr1.slice(0,rank1);

}

getCount([1,2,3,1,2,5,2,4,1,2,6,2,1,3,2])

默认情况,返回所有元素出现的次数

编写自己的代码库——javascript常用实例的实现与封装(上)-爱 • 范儿

getCount([1,2,3,1,2,5,2,4,1,2,6,2,1,3,2],3)

传参(rank=3),只返回出现次数排序前三的

编写自己的代码库——javascript常用实例的实现与封装(上)-爱 • 范儿

getCount([1,2,3,1,2,5,2,4,1,2,6,2,1,3,2],null,1)

传参(ranktype=1,rank=null),升序返回所有元素出现次数

编写自己的代码库——javascript常用实例的实现与封装(上)-爱 • 范儿

getCount([1,2,3,1,2,5,2,4,1,2,6,2,1,3,2],3,1)

传参(rank=3,ranktype=1),只返回出现次数排序(升序)前三的

编写自己的代码库——javascript常用实例的实现与封装(上)-爱 • 范儿

3-8得到n1-n2下标的数组

//getArrayNum([0,1,2,3,4,5,6,7,8,9],5,9)

//[5, 6, 7, 8, 9]

//getArrayNum([0,1,2,3,4,5,6,7,8,9],2) 不传第二个参数,默认返回从n1到数组结束的元素

//[2, 3, 4, 5, 6, 7, 8, 9]

function getArrayNum(arr,n1,n2){

var arr1=[],len=n2||arr.length-1;

for(var i=n1;i<=len;i++){

arr1.push(arr[i])

}

return arr1;

}

3-9筛选数组

/删除值为'val'的数组元素

//removeArrayForValue(['test','test1','test2','test','aaa'],'test','%')

//["aaa"]   带有'test'的都删除

 

//removeArrayForValue(['test','test1','test2','test','aaa'],'test')

//["test1", "test2", "aaa"]  //数组元素的值全等于'test'才被删除

function removeArrayForValue(arr,val,type){

    arr.filter(function(item){return type==='%'?item.indexOf(val)!==-1:item!==val})

}