JavaScript小技巧

1、在String.prototype.replace方法中使用 /g/i 标识符

字符串replace 不会替换所有匹配的子串——而是仅仅替换第一个匹配的内容,所以如果需要匹配全部,需要添加全局标识符 /g
如: str.replace(/cat/g,'test');

如果需要匹配大小写敏感的内容,则需要进行 用 /i
识符 str.replace(/cat/i,'test');

2、类数组转换

在JavaScript中会出现类数组情况,也就是有数组的特征,但是无法像数组一样直接操作类数组,典型的就是arguments数组。

如果需要,可以对类数组进行转化
Array.prototype.slice.call(arguments)

3、克隆数组
var clone = myArray.slice(0);
当然 参数0,也是可以省略的。估计是undefined是被转化为0了吧。

4、对象排序

面对一个对象里面的数字,你怎么排序呢是不是很麻烦。但是大神们已经挖掘出 sort 的强大之处,

[
    {name:'a',age:12},
    {name:'b',age:8},
    {name:'c',age:20}
].sort(function(obj1,obj2){
     return obj1.age-obj2.age;// 增序,降序obj2.age-obj1.age
})

5、清空数组
myArray.length = 0;

6、合并数组

var array2 = ['x','y'];
Array.prototype.push.apply(array1,array2);

array1 ;// [3,4,5,'x','y']

7、功能检查和属性检查
如果你以前这样写

if(innerHTML.document){
    // do something
}
//这可以很好的工作,但是效率并不高,更快更好的方式是
if('geolocation' in navigator){
    // do something
}

8、类型转换
注意这个属于技巧性的内容,如果不是很熟悉JavaScript,不推荐使用。
var str = ‘3.1425’;

// ~~ 取整 ,不进行四舍五入 类似Math.round
~~str; // 3
~~’4.99’; // 4

// 1* 浮点数
1 * ‘3.4232323’ ; // 3.4232323

// !! 布尔值 boolean
!!’3.2323’;// true
!!’0’;// true
!!”;//false

9、小数点保留
这个不算是技巧,主要是记不住
(3.234).toFixed(2);// 3.23

10、遍历数组
[3,4,5,6].map(function(el,index){
console.log(el+’\t’+index);// 3 0,4 1 ,…
});

Javasript 遍历数组的几种方式,forEach,map,还有for循环,那么这几种性能如何呢,我写了下面几种测试:

var arr = [];
for(var i=0;i<10000000;i++){
    arr[i] = i;
}

function test1(arr){
    var s = (new Date())*1;
    for(var len=arr.length-1;len>=0;len--){

    }
    var e = (new Date())*1;
    return e-s;
}

function test2(arr){
    var s = (new Date())*1;
    arr.map(function(el,index){

    });
    var e = (new Date())*1;
    return e-s;
}

function test3(arr){
    var s = (new Date())*1;
    arr.forEach(function(el,i){
    })
    var e = (new Date())*1;
    return e-s;
}
console.log("test1="+test1(arr));
console.log("test2="+test2(arr));
console.log("test3="+test3(arr));

//测试结果为 arr[10000000]
test1=5;
test2=317;
test3=293;

//所以如果数据量比较大,为了性能考虑,还是推荐使用for循环进行遍历
//测试结果为 arr[1000]
test1=0;
test2=0;
test3=0;

11、截断数组
截断数组跟截取数组不一样,截断会改变原始数组,并且只会从后面截前面;截取数组不会改变原数组,会返回截取的数组
截断数组:
var arr = [3,4,5,6,7];
// 截断后面2个
arr.length = 3;// arr = [3,4,5]

截取数组:
rr.slice(0,3);// 返回 [3,4,5] arr = [3,4,5,6,7];

12、删除数组的某一项
不要使用 delete来删除数组中的项,因为JS只是会用undefined来替换删除的项,并不是真正删除项。
而是使用是splice进行删除

var arr = [2,3,4,5,6];
arr.splice(2,1); // [4]   arr: [2,3,5,6] 

13、给定范围的随机数
Math.float(Math.random()*(max-min+1))+min;

14、随机数字和字母的字符串
Math.random().toString(16).substr(2);// 16进制,截取从第二位开始的串

15、获取数字数组的最大、最小值

这里使用了Function.protitype.apply方法传递参数的技巧

var num = [3,5,1,2,7,9,8];
var max = Math.max.apply(Math,num);
var min = Math.min.apply(Math,num);

16、时间Date 格式转成数字
(new Date())*1;// 21440404468679

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值