几个js开发过程中的小技巧

发表于   |     |   阅读次数

前言

javascript是一门非常灵活的语言，实际的开发过程中我们也可以灵活的使用它而给我们的工作带来便利，这篇文章记录了自己平时学习过程中经常用到的一些小技巧，整理出来作为笔记，也希望对感兴趣的同学有所帮助。( 持续更新… )

1 获取指定范围内的随机数

当我们需要获取指定范围(min,max)内的整数的时候，下面的代码非常适合。

1
2
3
function getRadomNum(min,max){
  return  Math.floor(Math.random() * (max - min + 1)) + min;
}

测试
测试

2 随机获取数组中的元素

1
2
3
function getRadomFromArr(arr){
  return arr[Math.floor(Math.random()*arr.length)];
}

测试
测试

3 生成从0到指定值的数字数组

1
2
3
var arr=[],length=100,i=1;
for(;arr.push(i++)<length;){}
console.log(arr)

测试
测试

4 打乱数字数组的顺序

1
2
var arr = [1,2,3,4,5,6,7,'a','dsfs',8,9,'v'];
arr.sort(function(){return Math.random()-0.5});

测试
测试

5 对象转换为数组

1
2
3
4
5
6
7
8
9
10
11
//注意对象必须是以下格式的才可以通过此方式转化为数组
//获取的DOM集合，以及函数的arguments也可以通过此方式转化为数组
var obj={
	0:'qian',
	1:'long',
	2:'chu',
	3:'tian',
	length:4
}
var _slice=[].slice;
var objArr=_slice.call(obj);

测试
图片描述

6 验证是否为数组

1
2
3
 function isArray(obj){
    return  Object.prototype.toString.call(obj) === '[object Array]' ;
}

测试

图片描述

7 获取数组中最大或者最小值

1
2
3
4
5
6
function maxAndMin(arr){
  return {
   max:Math.max.apply(null,arr.join(',').split(',')),
   min:Math.min.apply(null,arr.join(',').split(','))
  }
}

该方法适合一维或者多维数组求最大最小值的情况

测试
图片描述

8 清空数组

1
2
3
4
5
6
7
8
9
10
11
//方式一 通过将长度设置为0
var arr=[1,2,3,4,5];
arr.length=0;
//方式二 通过splice方法
 var arr=[1,2,3,4,5];
arr.splice(0,arr.length);
//方式三 通过将空数组 [] 赋值给数组(严格意义来说这只是将ary重新赋值为空数组，之前的数组如果没有引用在指向它将等待垃圾回收。)
var arr=[1,2,3,4,5];
arr=[];

9 保留指定小数位

1
2
var num =4.345678;
num = num.toFixed(4);  // 4.3457 第四位小数位以四舍五入计算

10 不要直接使用delete来删除数组中的元素

数组在js中也是对象，有时候我们可能会通过delete来删除数组中的元素，但是其实仅仅是将数组的元素的值赋值为了undefined。

1
2
3
var arr=[1,2,3,4,5,'谦龙','雏田'];
    delete arr[5];
    console.log(arr,arr[5],arr.length);

测试

图片描述

可以通过splice来删除数组中的某一项

1
2
3
var arr=[1,2,3,4,5,'谦龙','雏田'];
    arr.splice(5,1);
    console.log(arr,arr[5],arr.length);

测试

图片描述

11 生成指定长度的随机字母数字字符串

1
2
3
4
5
function getRandomStr(len) {
    var str = "";
    for( ; str.length < len; str  += Math.random().toString(36).substr(2));
    return  str.substr(0, len);
}

测试
图片描述

12 null 与 undefined

null == undefined,null == null 返回true,有时候我们为了排除null 和 undefined可以使用如下的代码

1
2
3
4
5
function test(obj){
    if(obj!=null){// obj除了undefined 和 null 之外都会走这里
        ....这里写代码逻辑
    }
}

13 找出数组中出现次数最的元素，并给出其出现过的位置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function getMaxAndIndex( arr ){
        var obj = {};
        arr.forEach(function(item,index){
            if(!obj[item]){
                obj[item]= {indexs: [index]}
            }else{
                obj[item]['indexs'].push(index);
            }
        });
        var num=0;//记录出现次数最大值
        var str='';//记录出现次数最多的字符
        var reArr;//返回最大值的位置数组
        for(var attr in obj){
            var temp=obj[attr]['indexs'];
            if(temp.length>num){
                num=temp.length;
                str=attr;
                reArr=temp;
            }
        }
        return {
            maxStr:str,
            indexs:reArr
        }
    }

测试结果
图片描述