您的位置:首页 > Web前端 > JavaScript

JavaScript小技巧

2015-08-24 15:46 211 查看
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
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: