常用数组方法

最新推荐文章于 2022-05-06 15:39:24 发布

zsr1860

最新推荐文章于 2022-05-06 15:39:24 发布

阅读量233

点赞数

分类专栏： javascript 杂记文章标签： javascript 数组

本文链接：https://blog.csdn.net/zsr1860/article/details/76614972

版权

javascript 同时被 2 个专栏收录

51 篇文章 1 订阅

订阅专栏

杂记

23 篇文章 1 订阅

订阅专栏

1、push() （尾部添加）

作用：向数组的末尾添加一项或多项元素
参数：要添加的项
返回值：新数组的长度
是否改变原数组：改变

var ary = ['a','b','c'];
var res = ary.push('d','e'); 
console.log(ary);  // ["a", "b", "c", "d", "e"]
console.log(res);  // 5

2、pop()（尾部删除）

作用：删除数组的最后一项
参数：无
返回值：被删除的项
是否改变原数组：改变

var ary = ['1','2','3'];
var res = ary.pop();
console.log(ary);  // ['1','2']
console.log(res);  // 3

3、shift()（首项删除）

作用：删除数组的首项
参数：无
返回值：被删除的项
是否改变原数组：改变

var ary = ['a','b','c'];
var res = ary.shift();
console.log(ary);  // ['b','c']
console.log(res);  // a

4、unshift()（首项添加）

作用：向数组的开头添加一或多项
参数：要添加的项，多项用’,’隔开
返回值：新数组的长度
是否改变原数组：改变

var ary = ['a','b','c'];
var res = ary.unshift('d','e');
console.log(ary);  // ["d", "e", "a", "b", "c"]
console.log(res);  // 5

5、splice()

作用：增删改
参数：arrayObject.splice(index,howmany,item1,…..,itemX)
返回值：删除的项
是否改变原数组：改变

var ary1 = [1,2,3,4,5];
var res1 = ary1.splice(1,0,6,7);
console.log(ary1);  // [1, 6, 7, 2, 3, 4, 5]
console.log(res1);  // [] 删除0项，返回一个空数组

var ary2 = [1,2,3,4,5];
var res2 = ary2.splice(1,2);
console.log(ary2);  // [1，4，5]
console.log(res2);  // [2，3] 

var ary3 = [1,2,3,4,5];
var res3 = ary3.splice(1,2,6,7);
console.log(ary3);  // [1, 6, 7, 4, 5]
console.log(res3);  // [2，3] 

//1.模拟 push(尾部添加) 和push()二者返回值不同
var ary = ['a','b','c'];
ary.splice(ary.length,0,'d'); //因为splice是在索引前添加，所以第一个参数为ary.length
console.log(ary);             //["a", "b", "c", "d"]

//2.模拟 pop(尾部删除)
var ary = ['a','b','c'];
ary.splice(ary.length-1,1);
console.log(ary);             //["a", "b"]

//3.模拟 shift(首项删除)
var ary = ['a','b','c'];
ary.splice(0,1);
console.log(ary);             //["b", "c"]

//4.模拟 unshift(首项添加) 和unshilft()二者返回值不同
var ary = ['a','b','c'];
ary.splice(0,0,'d');
console.log(ary);             //["d", "a", "b", "c"]

//5.从索引n开始删除到末尾,
var ary = ['a','b','c'];
ary.splice(1);                //表示从索引1开始删除到末尾
console.log(ary);             //["a"]

var ary = ['a','b','c'];
var res =  ary.splice(0);     //删除整个数组 利用返回值有克隆数组的效果
console.log(res);             //['a','b','c']

6、slice()

作用：从已有的数组中返回选定的元素
参数：arrayObject.slice(start,end) （start <= x < end）
返回值：取出的元素
是否改变原数组：不改变

var ary  = [1,2,3,4,5];
var res  = ary.slice(1,3);
var res2 = ary.slice(-3,-1);
console.log(ary);   //[1,2,3,4,5]
console.log(res);   //[2,3]
console.log(res2);  //[3,4] slice支持负参数，从最后一项开始算起，-1为最后一项，-2为倒数第二项

var res3 = ary.slice(2);    //从索引2开始复制到最后一项
console.log(res3);          //[3, 4, 5]
var res4 = ary.slice();     //复制整个数组
console.log(res4);          //[1, 2, 3, 4, 5]

7、join()

作用：用指定的分隔符将数组每一项拼接为字符串
参数：指定的分隔符,如果省略该参数，则使用逗号作为分隔符
返回值：拼接好的字符串
是否改变原数组：不改变

var ary = [1,2,3,4,5];
var res = ary.join('-');
console.log(ary);  // [1, 2, 3, 4, 5]
console.log(res);  // 1-2-3-4-5

8、concat()

作用：用于连接两个或多个数组
参数：参数可以是具体的值，也可以是数组对象。可以是任意多个
返回值：返回连接后的新数组
是否改变原数组：不改变

var ary  = [1,2,3,4,5];
var res  = ary.concat(6,7);
var res2 = ary.concat(6,[7,8]);
var res3 = ary.concat(6,[7,[8,9]]);
var res4 = ary.concat();
console.log(ary);   // [1, 2, 3, 4, 5]
console.log(res);   // [1, 2, 3, 4, 5, 6, 7]
console.log(res2);  // [1, 2, 3, 4, 5, 6, 7, 8]       concat() 如果操作的参数是数组，那么添加的是数组中的元素，而不是数组。
console.log(res3);  // [1, 2, 3, 4, 5, 6, 7, [8,9]]   如果是二维(或以上)数组，concat只能'拆开'一层数组
console.log(res4);  // [1, 2, 3, 4, 5]                如果concat()没有参数或者参数是空数组也可以达到克隆数组的目的

9、sort()

作用：对数组的元素进行排序
参数：可选(函数) 规定排序规则默认排序顺序为按字母升序
返回值：排好序的原数组
是否改变原数组：改变

var ary  = [1,5,7,9,12,24,56,87,92];
var ary2 = [1,5,7,9,12,24,56,87,92];
var ary3 = [1,5,7,9,12,24,56,87,92];
var res  = ary.sort();
var res2 = ary2.sort(function(a,b){
    return a-b;
})
var res3 = ary3.sort(function(a,b){
    return b-a;
})
//sort的参数函数总的形参a,b就是数组排序时候的相邻比较的两项
console.log(ary);        // [1, 12, 24, 5, 56, 7, 87, 9, 92]
console.log(res);        // [1, 12, 24, 5, 56, 7, 87, 9, 92]
console.log(res2);       // [1, 5, 7, 9, 12, 24, 56, 87, 92]
console.log(res3);       // [92, 87, 56, 24, 12, 9, 7, 5, 1]

10、reverse()

作用：倒序数组
参数：无
返回值：倒序后的原数组
是否改变原数组：改变

var ary = [1,2,3,4,5];
var res = ary.reverse();
console.log(ary);  // [5, 4, 3, 2, 1]
console.log(res);  // [5, 4, 3, 2, 1]

11、indexOf()

作用：查找指定元素的位置（该方法将从头到尾地检索）
参数：arrayObject.indexOf(item,start) item：查找的元素 start：字符串中开始检索的位置，如省略则从最第一个元素处开始查找
返回值：返回第一次查到的索引，未找到返回-1
是否改变原数组：不改变

var ary1 = [1,2,3,4,5]
var res1 = ary1.indexOf(3);
console.log(ary1);                // [1,2,3,4,5]
console.log(res1);                // 2
var ary2 = ['a','b','c','d','c'];
var res2 = ary2.indexOf('c',3);
var res3 = ary2.indexOf('e');
console.log(res2);                // 4
console.log(res3);                // -1

12、lastIndexOf()

作用：查找指定元素最后出现的位置（该方法将从尾到头地检索）
参数：arrayObject.lastIndexOf(item,start) item：查找的元素 start：字符串中开始检索的位置，如省略则从最后一个元素处开始查找
返回值：返回查到的元素的索引，未找到返回-1
是否改变原数组：不改变

var ary  = ['a','b','c','b','c'];
var res  = ary.lastIndexOf('c',ary.length);
var res2 = ary.lastIndexOf('d',ary.length);
console.log(res);   // 4
console.log(res2);  // -1

13、forEach

作用：循环遍历数组每一项
参数：函数 ary.forEach(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组
返回值：无
是否改变原数组：不改变

var ary = ['a','b','c'];
var res = ary.forEach(function(item,index,ary){
    console.log(item, index, ary);
    return item;
})
console.log(res);  // undefined  无返回值
/*
    a 0 ["a", "b", "c"]
    b 1 ["a", "b", "c"]
    c 2 ["a", "b", "c"]
*/

14、map()

作用：数组中的元素为原始数组元素调用函数处理后的值
参数：函数 ary.map(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组
返回值：新数组
是否改变原数组：不改变

var ary = ['a','b','c'];
var res = ary.map(function(item,index,ary){
    return item+1;
})
console.log(ary);  //["a", "b", "c"]
console.log(res);  //["a1", "b1", "c1"]

15、filter()

作用：过滤原数组中的元素
参数：函数 ary.filter(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组
返回值：新数组（符合条件的所有元素）
是否改变原数组：不改变

var ary = [1,2,3,4,5,6,12];
var res = ary.filter(function(item){
    return item < 6;
})
console.log(ary);  //[1, 2, 3, 4, 5, 6, 12]
console.log(res);  //[1, 2, 3, 4, 5]

16、every()

作用：检测数组所有元素是否都符合指定条件
参数：函数 ary.every(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组
返回值：布尔值
是否改变原数组：不改变

1 如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。

2 如果所有元素都满足条件，则返回 true。

var ary = [1,2,3,4,5,6];
var res = ary.every(function(item){
    return item < 3;
})
var res2 = ary.every(function(item){
    return item < 7;
})
console.log(res);   // false;
console.log(res2);  // true;

17、some()

作用：检测数组中的元素是否满足指定条件
参数：函数 ary.some(function(item,index,ary){}) item:每一项 index:索引 ary:当前数组
返回值：布尔值
是否改变原数组：不改变

1 如果有一个元素满足条件，则表达式返回 true , 剩余的元素不会再执行检测。

2 如果没有满足条件的元素，则返回 false。

var ary = [3,4,5,6,7,8,9]
var res1 = ary.some(function(item){
    return item < 5;
})
var res2 = ary.some(function(item){
    return item < 3;
})
console.log(res1)  // true;
console.log(res2)  // false;