JavaScript中Array的实用操作技巧分享
一、关于Array
Array的创建很灵活,可以使用Array构造函数,也可以直接创建数组“字面量”。
vararr=newArray();//[]
varbrr=Array();//[]两者等效
vararr=Array(3);//[]
arr.length;//3长度为3的空数组
vararr=Array(22,33,'qq',{});//[22,33,"qq",Object]
varbrr=[22,33,'qq',{}];//同上
Array是JavaScript的内置对象,是的,虽然是数组,也是一种对象!!
使用typeof判断会返回Object!而Array.isArray方法能更精准判断其类型。
vara=[]; typeofa;//object Array.isArray(a);//true
二、常用方法
push()方法
push方法能添加一个或者多个元素至数组的末端,并返回被改变后的数组的长度!
注意:①其返回的是数组的长度,而不是数组!
②此方法会改变原数组!!
vararr=Array(22,33,'qq',{});
arr.push('weibo');//5
arr//[22,33,"qq",{},"weibo"]
当我们想合并两个数组时需要这样使用
vara=[22,33]; varb=[44,55]; Array.prototype.push.apply(a,b) //或者 a.push.apply(a,b) //或者 a.push(44,55);//此时的数组a=[22,33,44,55];
注意不能写成以下这样!!
a.push(b); a;//[22,33,[44,55]] a.length;//3!! console.log(a);//[22,33,Array[2]]
直接写成a.push(b),会将b认为是一个元素添加到a,并不能得到理想效果!
倘若现在又两个对象数组需要合并就像如下:
vara=[
{name:'Stark',value:'Ironman'},
{name:'Cap',value:'Oldman'}
];
varb=[
{name:'Jerry',email:'Jerry@qq.com'},
{name:'Lory',email:'Lory@163.com'},
{name:'susan',email:'susan@gmail.com'}
];
//错误写法
a.push(b);//3
console.log(a);//[Object,Object,Array[3]]
//正确写法
a.push.apply(a.b);//5
console.log(a);//[Object,Object,Object,Object,Object]
pop()方法
与push相反,是删除数组最后一个元素并返回这个被删除的元素:
vara=['qq','weibo','weixin']; a.pop();//'weixin' a;//['qq','weibo']
join()方法
将数组按照相应参数分隔开,并以字符串形式返回,若空参数,则使用‘,'分隔。此方法并不会改变原数组:
vara=[1,2,3,4];
a.join('')//'1234'
a.join('|')//"1|2|3|4"
varb=a.join()//"1,2,3,4"
console.log(a);//[1,2,3,4]
console.log(b);//"1,2,3,4"
concat()方法
能将多个数组合并,返回一个新的数组,但原数组不变:
vara=[22,33]; varb=[44,55]; varc=a.concat(b); console.log(a);//[22,33] console.log(b);//[44,55] console.log(c);//[22,33,44,55]
vara=[{name:'tom',email:'tom@example.com'},
{name:'peter',email:'peter@163.com'}];
varb=[{name:'Jerry',email:'Jerry@qq.com'},
{name:'Lory',email:'Lory@dfl.com'},
{name:'susan',value:'susan@gmail.com'}];
varc=a.concat(b);
c;//[{name:'tom',email:'tom@example.com'},
//{name:'peter',email:'peter@163.com'},
//{name:'Jerry',email:'Jerry@qq.com'},
//{name:'Lory',email:'Lory@dfl.com'},
//{name:'susan',value:'susan@gmail.com'}]
map()方法
map方法会对数组的各个成员依次调用一个函数,返回一个经函数处理后的新数组,但原数组并不会被改变!
varnumbers=[1,2,3];
varnum=numbers.map(function(n){//[2,4,6]
returnn*2;
});
numbers;//[1,2,3]
map方法调用的函数的参数为一个时,此参数表示数组的当前成员;当参数为三个是依次为
当前成员elem,索引index,原数组本身arr
varbrr=[1,2,3].map(function(elem,index,arr){
returnelem*index;
});
brr;//[0,2,6]
map方法还可以接受第二个参数,表示回调函数执行时this所指向的对象。
vararr=['a','b','c'];
varbrr=[0,2].map(function(e){
returnthis[e];
},arr)
brr;//['a','c']
在应用中,有时使用ajax技术需要动态利用参数数组转换成一个url请求时,map方法会非常方便,例如:
varb=[
{name:'Jerry',email:'Jerry@qq.com'},
{name:'Lory',email:'Lory@dfl.com'},
{name:'susan',value:'susan@gmail.com'}];
varurl=b.
map(function(n){
returnn.name+"="+n.email
})
.join("&");
console.log(url);
//Jerry=Jerry@qq.com&Lory=Lory@dfl.com&susan=susan@gmail.com
然后在url前面加上ip地址以及action和方法,就能完成一个ajax所需的动态url的拼接,例如:
varendURL="localhost:8080/XXXX/"+eventAction+"!"+operation+"?" +url;
总结
以上就是这篇文章的全部内容,希望对能大家的学习或者工作带来一定的帮助,如果有疑问大家可以留言交流。