js操作数组的常用方法

目录

一 、数组的创建

1、字面量创建

var arr =[];let arr2 =[];//es6新增声明变量的方法//数组中的值用,分割var arr =[1,3,4,5,7,9,0];

2、内置构造函数创建

var arr =newArray();// 括号()内不传递参数表示声明了一个空数组let arr2 =newArray();
console.log(arr)// []let arr =newArray(4);//声明了一个length = 4的空数组
console.log(arr.length)// 4 
console.log(arr)// []let arr =newArray(1,3,4,5,7,9,0);//多个数据时，每个数据都是数组里面的成员
console.log(arr)// [1, 3, 4, 5, 7, 9, 0]

注： 查看数组的长度 arr.length

二、常用方法

1、arr[索引值]

（1）修改数组当前索引值的数据
（2）向数组中添加一个新成员，length的索引值，否则依然为修改操作

let arr =[1,4,6,7,8];//length = 5
arr[3]=0;
console.log(arr);// [1, 4, 6, 0, 8]
console.log(arr.length);//length = 5let arrAdd =[1,4,6,7,8];//length = 5
arrAdd[5]=0;
console.log(arrAdd);// [1, 4, 6, 7, 8, 0]
console.log(arrAdd.length);// 6

2、arr.push() 末尾追加

（1）作用：向数组末尾追加一个数据
（2）返回值：追加该数据以后的新数组的长度

let arr =[1,4,6,7,8];//length = 5let srr2 = arr.push(5);
console.log(arr2)// 6
console.log(arr)// [1, 4, 6, 7, 8, 5]

3、arr.unshift() 首位添加

（1）作用：向数组首位添加一个数据
（2）返回值：追加该数据以后的新数组的长度

let arr =[1,4,6,7,8];//length = 5let arr2 = arr.unshift(5);
console.log(arr)// [5, 1, 4, 6, 7, 8]
console.log(arr2)// 6

4、arr.pop() 删除最后一项

（1）作用：删除数组最后一项的数据
（2）返回值：删除的最后一项数据

let arr =[1,4,6,7,8];//length = 5let arr2 = arr.pop();//删除8
console.log(arr)// [1, 4, 6, 7]
console.log(arr2)// 8

5、arr.shift() 删除第一项

（1）作用：删除数组第一项的数据
（2）返回值：删除的第一项数据

let arr =[1,4,6,7,8];//length = 5let arr2 = arr.shift();//删除1
console.log(arr)// [4, 6, 7, 8]
console.log(arr2)// 1

6、arr.reverse() 反转数组

（1）作用：反转数组，也就是把数组中的数据倒着重新排列
（2）返回值：反转后的新数组

let arr =[1,4,6,7,8];//length = 5
arr.reverse();  
console.log(arr)// [8, 7, 6, 4, 1]
console.log(arr.length)// 5

7、arr.sort() 排序

（1）作用：按照某顺序给数组重新排序
（2）返回值：排序后的新数组

let arr =[1,4,6,9,0];//length = 5
arr.sort(function(a,b){// 箭头函数也可以return a - b;//小到大排列}); 
console.log(arr)// [0, 1, 4, 6, 9]
console.log(arr.length)// 5/* ============================================== */
arr.sort(function(a,b){return b - a;// 大到小排列});  
console.log(arr)// [9, 6, 4, 1, 0]
console.log(arr.length)// 5

8、arr.concat() 拼接

（1）作用：拼接数组，多个数组拼接或着拼接某些内容
（2）返回值：拼接后的新数组

let arr =[1,4,6,7,8];let arr1 =[0,9,3,5];    
console.log(arr.concat(arr1))// [1, 4, 6, 7, 8, 0, 9, 3, 5]
console.log(arr.concat('你好'))[1,4,6,7,8,'你好']

9、arr.join() 连接

（1）作用：将数组的每一项通过设定的连接符连接为一个字符串
（2）返回值：连接后的字符串
(3) 参数： 不传值时默认为，

let arr =[1,4,6,7,8];  
console.log(arr.join('-'))// 1-4-6-7-8
console.log(arr.join())// 1,4,6,7,8

10、arr.slice() 有范围截取

（1）作用：从开始索引值截取到结束索引值（包前不包后）
（2）返回值：截取出来的新数据
（3) 特殊： 可以传递负整数（表示倒数第几个开始,-1表示最后一个）

let arr =[1,4,6,7,3,8,0];//从索引值为1的位置截取到索引值为3位置，包含索引值为1的数据，不包含索引值为3的数据（包前不包后）
console.log(arr.slice(1,3))// [4, 6] //从倒数第四位开始截取到左后一位，依旧是包前不包后
console.log(arr.slice(-4,-1))// [7, 3, 8]

11、arr.splice() 截取、删除

（1）作用：用来添加或者截取数组中的某些数据
（2） 方法：
arr.splice(操作的开始索引值，截取个数)；
arr.splice(操作的开始索引值，截取个数，新数据1，新数据2，……)
（3）返回值：截取出来的数据或者替换后的新数组
（4） 特殊： 可以传递负整数（表示倒数第几个开始,-1表示最后一个）

let arr =[1,4,6,7,3,8,0];//从索引为1的位置开始截取5个数据 
console.log(arr.splice(1,5))// [4, 6, 7, 3, 8]//从索引为2的位置开始截取3个数据,并在原数组中的相对应位置追加新数据
console.log(arr.splice(2,3,'你','好','呀'));//[6, 7, 3]
console.log(arr).//[1, 4, '你', '好', '呀', 8, 0]

12、arr.indexOf() 查数据

（1）作用：查找数组中有无相关数据
（2）返回值：有相关数据返回对应的索引值；没有则返回-1

let arr =[1,4,6,7,8];  
console.log(arr.indexOf(6))// 2 （6对应的索引值为2）
console.log(arr.indexOf(0))// -1 数组中不含有0这个数据

13、arr.includes() 查数据

（1）作用：查找数组中有无相关数据
（2）返回值：一个布尔值。
数组中包含该元素 ==》 true
数组中不含有该元素 ==》 false

let arr =[1,4,6,7,8];  
console.log(arr.includes(3))// false
console.log(arr.includes(6))// true

14、arr.forEach() 遍历

（1）作用：遍历数组

let arr =[1,4,6,7,8];  
arr.forEach((item, index, arr)=>{
    console.log('数据:', item,',索引值:',index,',原始数组:',arr)})/*     数据: 1 ,索引值: 0 ,原始数组: (5) [1, 4, 6, 7, 8]
    数据: 4 ,索引值: 1 ,原始数组: (5) [1, 4, 6, 7, 8]
    数据: 6 ,索引值: 2 ,原始数组: (5) [1, 4, 6, 7, 8]
    数据: 7 ,索引值: 3 ,原始数组: (5) [1, 4, 6, 7, 8]
    数据: 8 ,索引值: 4 ,原始数组: (5) [1, 4, 6, 7, 8]
    如上，参数1：item为数组中的每一项内容；参数2：index 为数据的索引值; 参数3: arr为原数组，不会发生改变，通常使用前俩 */

15、arr.map() 映射

（1）作用：映射数组
（2）返回值：映射后的新数组

let arr =[1,4,6,7,8];let arr2 = arr.map((item, index)=>{
    console.log('数据:', item,',索引值:',index)return item +1;//值+1操作})
console.log(arr2)//[2, 5, 7, 8, 9]
console.log(arr)//[1, 4, 6, 7, 8]/*    数据: 1 ,索引值: 0
     数据: 4 ,索引值: 1
    数据: 6 ,索引值: 2
    数据: 7 ,索引值: 3
    数据: 8 ,索引值: 4
    如上，参数1：item为数组中的每一项内容；参数2：index 为数据的索引值; */

16、arr.filter() 过滤

（1）作用：按条件过滤数组中的数据
（2）返回值：符合条件的数据组成的新数组

let arr =[1,4,6,7,8];let arr2 = arr.filter((item, index)=>{if(item %2==0){return item;}})
console.log(arr2)//[4, 6, 8]
console.log(arr)//[1, 4, 6, 7, 8]

17、arr.every() 检测（都符合）

（1）作用：检测数组中的每一项是否都符合规则
（2）返回值：一个布尔值。
数组中的每一项都符合规则 ==》true
某一项不符合规则 ==》false（其余项将不进行检测，直接返回）

let arr =[1,4,6,7,8];let arr2 = arr.every((item)=>{return item %2==0;})
console.log(arr2)// falselet arr3 = arr.every((item)=>{return item >0;})
console.log(arr3)// true

18、arr.some() 检测（部分符合）

（1）作用：检测数组中的元素是否符合规定条件
（2）返回值：一个布尔值。
数组中只要有一项符合规则 ==》 true （其余项将不进行检测，直接返回）
数组中所有项都不符合规则 ==》 false

let arr =[1,4,6,7,8];let arr2 = arr.some((item)=>{return item %2==0;})
console.log(arr2)// truelet arr3 = arr.some((item)=>{return item <0;})
console.log(arr3)// false

三、是否改变原数组

方法是否会改变原数组返回值.push()会追加该数据以后的新数组的长度.unshift()会追加该数据以后的新数组的长度.pop()会删除的最后一项数据.shift()会删除的第一项数据.reverse()会反转后的新数组.sort()会排序后的新数组.splice()会截取出来的数据或者替换后的新数组