Js基础回顾--Array常用的方法
数组常用方法
1 concat()
concat() 方法用于连接两个或多个数组。该方法不会改变原数组,返回连接生成的数组。
let arr1 = [1,2]; let arr2 = [3,4,5]; let arr3 = arr1.concat(arr2); console.log(arr1); //[1, 2] console.log(arr3); //[1, 2, 3, 4, 5]
2 join()
join() 方法用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔符进行分隔的,默认使用','号分割,不改变原数组。
let arr = [1,2,3]; console.log(arr.join()); //1,2,3 console.log(arr.join('-'));//1-2-3 console.log(arr); //[1,2,3]
3 slice()
返回一个新的数组,包含从原数组从 start 到 end (包头不包尾)的元素。该方法不会修改原数组。
let arr = [1,2,3,4,5]; console.log(arr.slice(1,3));//[2,3] console.log(arr); //[1,2,3,4,5]
4 push()*
push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。会改变原数组。
let arr = ['a','b','c','d']; let x=arr.push('e'); console.log(x); //5 console.log(arr); //['a','b','c','d','e'];
5 pop()*
pop() 方法用于删除并返回数组的最后一个元素。会改变原数组。
let arr = ['a','b','c','d']; let x=arr.pop(); console.log(x); //d console.log(arr); //['a','b','c'];
6 unshift()*
unshift() 方法可向数组的开头添加一个或更多元素,并返回新的长度。改变原数组。
let arr = ['a','b','c','d']; let x=arr.unshift('e'); console.log(x); //5 console.log(arr); //['e','a','b','c'];
7 shift()*
shift() 方法用于删除并返回数组的第一个元素。改变原数组。
let arr = ['a','b','c','d']; let x=arr.shift(); console.log(x); //a console.log(arr); //['b','c','d'];
8 splice()*
splice() 方法可删除从 index 处开始的零个或多个元素,并用参数列表中声明的一个或多个值来替换那些被删除的元素。返回被删除元素的数组。splice() 方法会直接对数组进行修改。
//不删除元素,相当于插入元素。从索引2开始删除0个元素,用'hello','world'替代 let arr = ['a','b','c','d']; let x=arr.splice(2,0,'hello','world'); console.log(x);//[] console.log(arr);//['a','b','hello','world','c','d']; //删除元素,并替换。从索引2开始删除2个元素,用'hello','world'替代 let arr1 = ['a','b','c','d']; let x1=arr1.splice(2,2,'hello','world'); console.log(x1);//['c','d'] console.log(arr1);//['a','b','hello','world'];
9 substring() 和 substr()
substring()和substr()都用于截取字符串的一部分,用法如下:
let str='abcdefgh'; //当为一个参数时两个方法都返回从index截取到最后 console.log(str.substr(2)) //cdefgh console.log(str.substring(2))//cdefgh //substr(startindex,length),从startindex截取指定长度 console.log(str.substr(2,4)); //cdef //substr(startindex,endindex),从startindex截取到endindex,包头不包尾 console.log(str.substring(2,4));//cd console.log(str) //abcdefgh
10 sort()*
sort()会按照元素首字母的 Unicode code 位置排序,默认升序。sort()会改变原数组。
let arr=['c','dddd','bbb','ee','aa']; console.log(arr.sort()); //['aa', 'bbb', 'c', 'dddd', 'ee'] console.log(arr); //['aa', 'bbb', 'c', 'dddd', 'ee'] let numArr=[10,2,30,15,23]; console.log(numArr.sort());//[10, 15, 2, 23, 30] console.log(numArr); //[10, 15, 2, 23, 30]
有时候我们排序的规则并不是按照默认方式的,如上边的例子中需求是:arr按照字符串的长度排序,numArr按照大小进行排序。我们可以重写排序规则,如下:
//按照字符串的长度排序 let arr = ['c', 'dddd', 'bbb', 'ee', 'aa']; arr.sort((str1, str2) => { return str1.length - str2.length; }) console.log(arr); //["c", "ee", "aa", "bbb", "dddd"] //按照大小进行排序 let numArr = [10, 2, 30, 15, 23]; numArr.sort((num1, num2) => { return num1 - num2; }) console.log(numArr); // [2, 10, 15, 23, 30]
11 reverse()*
reverse() 方法用于颠倒数组中元素的顺序。返回的是颠倒后的数组,会改变原数组。
let arr=["a", "b", "c", "d", "e"] console.log(arr.reverse());//["e", "d", "c", "b", "a"] console.log(arr); //["e", "d", "c", "b", "a"]
12 indexOf() 和 lastIndexOf()
indexOf()和lastIndexOf()用于查找元素的位置,可以接受1/2个参数,用法如下:
let arr=["a", "b", "c", "d", "e","a"] //indexOf console.log(arr.indexOf("a"));//查找第一个a的索引 0 console.log(arr.indexOf("a",2));//在索引2(包含)之后查找 5 //lastIndexOf console.log(arr.lastIndexOf("a"));//查找最后一个a的索引 5 console.log(arr.lastIndexOf("a",2));//在索引2(包含)之前查找 0
13 every()和some()
every:所有元素都满足给定条件的话返回true;some:只要有一个元素满足给定条件就返回true,用法如下:
let arr=[5,12,6,7,9]; //判断是否所有元素都大于10,只有所有元素都满足条件才返回true let res1=arr.every((ele,index,array)=>{ return ele<10 }) console.log(res1);//false //判断是否有元素大于10,只要有一个元素满足条件就返回true let res2=arr.some((ele,index,array)=>{ return ele<10 }) console.log(res2);//true
14 filter()
筛选数组中满足给定条件的元素,返回满足条件元素组成的数组。不会改变原数组。
let arr=[5,12,6,7,9]; //过滤数组,返回满足条件的元素组成的数组 let res=arr.filter((ele,index,array)=>{ return ele<10; }) console.log(res);// [5, 6, 7, 9] console.log(arr);//[5,12,6,7,9]
15 map()
数组的每个元素都执行指定操作,返回各个元素执行结果组成的数组。该方法不改变原数组。
let arr=[5,12,6,7,9]; //遍历数组,每一个元素都执行指定操作,返回一个新的数组 res=arr.map((ele,index,array)=>{ return ele+1; }) console.log(res);//[6, 13, 7, 8, 10] console.log(arr);//[5,12,6,7,9]
16 forEach()
纯粹的遍历数组,无返回值。该方法不改变原数组。
let arr=[5,12,6,7,9]; //单纯的进行数组遍历,打印数组中的每一个元素 arr.forEach((ele,index,arrya)=>{ console.log(ele); }) //打印:5,12,6,7,9
ES6新增方法
01 find()和findIndex()
let arr=[15,12,6,7,9]; //查找第一个小于10的元素并返回该元素 res=arr.find((ele,index,array)=>{ return ele<10; }) console.log(res);//6 //查找第一个小于10的元素并返回该元素的索引 resindex=arr.findIndex((ele,index,array)=>{ return ele<10; }) console.log(resindex);//2
02 fill()*
用固定值替换数组中的元素,可以指定替换元素的索引范围。该方法会改变原数组。
//不指定索引范围 let arr=["apple","peer","banana","orange"] arr.fill("mango"); console.log(arr);//["mango", "mango", "mango", "mango"] //指定索引范围 arr.fill(value,startindex,endindex) let arr1=["apple","peer","banana","orange"] arr1.fill("mango",2,4); console.log(arr1);//["apple", "peer", "mango", "mango"]
03 includes()
判断数组中是否存在某元素,参数:查找的值、起始位置。使用indexOf 不能判断是否包含NaN。
let arr=[2,1,5,4,3,NaN]; console.log(arr.includes(2));//true //arr.includes(ele,startindex) 从索引1开始搜索元素 console.log(arr.includes(2,1)); //false console.log(arr.includes(6)); //false console.log(arr.indexOf(NaN));//-1,因为NaN!==NaN console.log(arr.includes(NaN)); //true
04 Array.from()
将类似数组的对象(array-like object)和可遍历(iterable)的对象转为真正的数组。
//1.类数组转为数组 function foo(){ let arr= Array.from(arguments); console.log(arr); } foo(1,2,3,4,5) //[1, 2, 3, 4, 5] //2.可遍历对象转成数组 let myset=new Set(); myset.add("a"); myset.add("b"); myset.add("c"); let arr=Array.from(myset); console.log(arr);//["a", "b", "c"] //3.数组去重小技巧 let res=Array.from(new Set([1,1,2,2,2,3])) console.log(res);//[1,2,3]