欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

Javascript几种处理数组的方法介绍

程序员文章站 2022-11-09 08:38:35
一 迭代方法 es5为数组定义了5个迭代方法,这些方法大大方便了处理数组的任务,支持这些方法的有 ie9+,firefox2+,safari3+,opera9.5+和chrome...

一 迭代方法

es5为数组定义了5个迭代方法,这些方法大大方便了处理数组的任务,支持这些方法的有 ie9+,firefox2+,safari3+,opera9.5+和chrome。

1 every

对数组中每一项进行给定函数,如果每一项都返回true,则返回true

var numbers = [1,2,3,4,5,4,3,2,1];

var everyresult = numbers.every(function(item,index,array){
    return item>2;
});

alert(everyresult);   //false

2 some

对数组中每一项进行给定函数,如果任意一项都返回true,则返回true

var numbers = [1,2,3,4,5,4,3,2,1];

var everyresult = numbers.some(function(item,index,array){
    return item>2;
});

alert(everyresult);   //true

3 filter

对数组中每一项进行给定函数,返回该函数会返回true的项组成的数组

var numbers = [1,2,3,4,5,4,3,2,1];

var everyresult = numbers.filter(function(item,index,array){
    return item>2;
});

alert(everyresult);   //  [3,4,5,4,3]

4 map

对数组中每一项进行给定函数,返回每次函数调用的结果组成的数组

var numbers = [1,2,3,4,5,4,3,2,1];

var everyresult = numbers.map(function(item,index,array){
    return item*2;
});

alert(everyresult);   //  [2, 4, 6, 8, 10, 8, 6, 4, 2]

5 foreach

对数组中每一项进行给定函数,没有返回值,和for循环类似

var numbers = [1,2,3,4,5,4,3,2,1];

numbers.foreach(function(item,index,array){
    if(item!=2){
        numbers.splice(index,1,2);
    }
});

alert(numbers);   //  [2, 2, 2, 2, 2, 2, 2, 2, 2]

二 归并方法

es5新增了两个归并数组的方法:reduce()和reduceright()。这两个方法迭代数组所有项,然后构建一个最终返回的值。reduce从左到右,reduceright从右到左。

var values = [1,2,3,4,5];

var sum = values.reduce(function(prev,cur,index,array){
    return prev + cur;
});
alert(sum); //15

reduce()函数接受四个参数;前一个值、当前值、index和数组对象。这个函数返回的任何值都会作为第一个参数自动传给下一项。第一次迭代发生在第二项上,因此第一个参数是数组的第一项,第二个参数是数组的第二项。

三 检测数组

es3的方法:instanceof

var values = [1,2,3];
if(values instanceof array){
    //对数组进行某些操作
}

es5的方法:array.isarray

var values = [1,2,3];
if(array.isarray(values)){
    //对数组进行某些操作
}

四 转换方法

1 tolocalestring() tostring() valueof()

2 join() 将数组转换为字符串,且用分隔符分割

var colors = [1,2,3];
alert(colors.join("|"));  // 1|2|3

五 栈方法

栈方法是指last-in-first-out后进先出

push() 从数组末尾添加
pop()  从数组末尾移除

六 队列方法

队列方法是first-in-first-out先进先出

shift()    从数组前端移除
unshift()  从数组前端添加

七 重排序方法

reverse()  反转数组

sort()     排序

var values = [0,1,5,10,15];
values.sort(function(a,b){
    return b-a;
});
console.log(values);  //[15, 10, 5, 1, 0]

八 操作方法

1 concat() 用于复制或者从尾部添加–>创建新数组

先创建一个当前数组的副本,然后jiang将接到的数组添加到末尾,返回新的数组。如果没有传参数,直接复制返回新构建的数组。

var values = [1,2,3];
var v1 = values.concat();
var v2 = values.concat(4);

console.log(values);  //[1,2,3]
console.log(v1);      //[1,2,3]
console.log(v2);      //[1,2,3,4]

2 slice() 用于复制或截取数组–>创建新数组

截取当前数组的一部分创建一个新数组。可以接受一个或者两个参数,只有一个参数时返回指定位置到尾部的数组。两个参数时,返回指定位置到结束位置之前但不包括结束位置的数组。

var values = [1,2,3];
var v1 = values.slice();
var v2 = values.slice(1);
var v3 = values.slice(1,3);

console.log(values);  //[1,2,3]
console.log(v1);      //[1,2,3]
console.log(v2);      //[2,3]
console.log(v3);      //[2,3]

3 splice() 用于删除、插入、替换,号称最强大的数组方法

3.1 删除:可以删除任意数量的项,需要两个参数,要删除的第一项的位置和要删除的项数。

var values = [1,2,3,4,5,6];
var v = values.splice(0,2);

console.log(values);  //[3,4,5,6]
console.log(v);       //[1,2]

3.2 插入和替换:至少三个参数,第一个是起始位置,第二个是要删除的项,第三个及以后shi yao是要插入或替换的值。

插入demo:
var values = [1,2,3,4,5,6];
var v1 = values.splice(1,0,1,1,1);

console.log(values);  //[1,1,1,1,2,3,4,5,6]
console.log(v1);      //[]

替换demo:
var values = [1,2,3,4,5,6];
var v1 = values.splice(1,2,1,1,1);

console.log(values);  //[1,1,1,1,4,5,6]
console.log(v1);       //[2,3]

九 位置方法

var values = [1,2,3,4,5];
indexof() 从头找指定项的位置
var v1 = values.indexof(3);


lastindexof() 从后往前查位置
var v2 = values.lastindexof(3);

两者如果没查到都返回-1