1、join()
使用分隔符将数组转为字符串并返回,不改变原数组
let arr1=['a','c','e']
console.log(arr1.join('%')) //a%c%e
也可以使用分隔符将字符串转为数组
let str1='a%c%e'
console.log(str1.split('%')) //['a','c','e']
2、push、pop、shift、unshift方法
push()方法向数组的末尾添加一个元素
pop()方法将数组的末尾元素弹出
shift()方法向数组的开头添加一个元素
unshift()方法将数组的第一个元素弹出
以上方法均会改变原数组
3、reverse()
反转数组,即数组开头变末尾,末尾变开头。会改变原数组
4、slice()
截取指定位置的数组并返回该元素。不会改变原数组
array.slice(start,end) start、end为数组下标,包括start不包括end,返回start到end之间的元素。
let arr1=['a','b','c','d','e']
console.log(arr1.slice(1,3)) //['b','c']
5、splice()
看出js数组最强大的方法,可以实现删除、添加、的操作。会改变原数组
array.splice(index,howmany,item1…itemx)
参数 | 描述 |
---|---|
index | 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。 |
howmany | 可选。规定应该删除多少元素。必须是数字,但可以是 “0”。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。 |
item1…itemx | 可选。要添加到数组的新元素 |
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");
console.log(fruits)//Banana,Orange,Lemon,Kiwi,Apple,Mango
6、sort()
按照字符顺序为数组元素排序。改变原数组
let arr1=[1,2,10,100,3]
console.log(arr1.sort())//[1,10,100,2,3]
function sheng(a,b){
if(a>b) return 1
else return -1
}
function jiang(a,b){
if(a<b) return 1
else return -1
}
console.log(arr1.sort(jiang)) //[1,2,3,10,100]
console.log(arr1.sort(sheng)) //[100,10,3,2,1]
7、indexOf()
返回参数在数组中的下标,如果没有则返回-1
let arr1=['a','b','c']
console.log(arr1.indexOf('b'))
8、forEach()
遍历数组中的每一项,并执行匿名函数对其进行处理,没有返回值,不改变原数组。
let arr1=[1,2,3,4]
let newArr1=arr1.forEach(function(value,index.arr){
console.log(value*2)
})//2,4,6,8
参数:
value:遍历的当前数组元素
index:当前元素的下标
arr:当前数组
9、map()
和forEach的区别是,map返回一个新数组。不改变原数组
let arr1=[1,2,10,100,3]
let newArr=arr1.map(function(value,index,arr){
return value*2
})
console.log(newArr)//2,4,20,200,6
10、filter()
和map的区别是:filter的回调函数返回布尔值,为true的数据组成新数组由filter返回
let arr1=[1,2,10,100,3]
let newArr=arr1.filter(function(value,index,arr){
return value>3
})
console.log(newArr) //[10,100]
可以看出filter具有过滤的作用
11、every()
与filter一样,every返回值也为布尔值,当为true时,继续遍历,当为false时,停止遍历。有一个为false,返回值就位false。
//用法一
let arr1=[1,2,10,100,3]
let newArr=arr1.every(function(value,index,arr){
return value>3
})
console.log(newArr) //false
//用法二
let arr1=[1,2,10,100,3]
let newArr=arr1.every(function(value,index,arr){
console.log(value)
return value<3
})
console.log(newArr) // 1,2,10 因为是先输出后比较的
some()
功能:判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。
参数:some()接收一个回调函数作为参数,这个回调函数需要有返回值,some(callback);callback默认有三个参数,分别为value,index,self。
功能1:因为要判断数组中的每一项,只要有一个回调函数返回true,some都会返回true,所以与every正好相反,当遇到一个回调函数的返回值为true时,可以确定结果,那么停止执行,后面都数据不再遍历,停在第一个返回true的位置;当回调函数的返回值为false时,需要继续向后执行,到最后才能确定结果,所以会遍历所有数据,实现类似于forEach的功能,遍历所有。
功能1:因为要判断数组中的每一项,只要有一个回调函数返回true,some都会返回true,所以与every正好相反,当遇到一个回调函数的返回值为true时,可以确定结果,那么停止执行,后面都数据不再遍历,停在第一个返回true的位置;当回调函数的返回值为false时,需要继续向后执行,到最后才能确定结果,所以会遍历所有数据,实现类似于forEach的功能,遍历所有。
//demo1:
var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
var a = arr.some(function(value,index,self){
console.log(value + "--" + index + "--" + (arr == self))
return value.length > 3;
})
// 打印结果为:
// Tom--0--true
// abc--1--true
// Jack--2--true
//demo2:
var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
var a = arr.some(function(value,index,self){
console.log(value + "--" + index + "--" + (arr == self))
return true;
})
// 打印结果为:
// Tom--0--true
//demo3:
var arr = ["Tom","abc","Jack","Lucy","Lily","May"];
var a = arr.some(function(value,index,self){
console.log(value + "--" + index + "--" + (arr == self))
return false;
})
// 打印结果为:
// Tom--0--true
// abc--1--true
// Jack--2--true
// Lucy--3--true
// Lily--4--true
// May--5--true
reduce()
功能:从数组的第一项开始,逐个遍历到最后,迭代数组的所有项,然后构建一个最终返回的值。
参数:reduce()接收一个或两个参数:第一个是回调函数,表示在数组的每一项上调用的函数;第二个参数(可选的)作为归并的初始值,被回调函数第一次执行时的第一个参数接收。 reduce(callback,initial);callback默认有四个参数,分别为prev,now,index,self。 callback返回的任何值都会作为下一次执行的第一个参数。 如果initial参数被省略,那么第一次迭代发生在数组的第二项上,因此callback的第一个参数是数组的第一项,第二个参数就是数组的第二项。
//demo1:不省略initial参数,回调函数没有返回值
var arr = [10,20,30,40,50];
arr.reduce(function(prev,now,index,self){
console.log(prev + "--" + now + "--" + index + "--" + (arr == self))
}, 2019)
// 打印结果为:
// 2019--10--0--true
// undefined--20--1--true
// undefined--30--2--true
// undefined--40--3--true
// undefined--50--4--true
// 此时回调函数没有return,所以从第二次开始,prev拿到的是undefined
//demo2:省略initial参数,回调函数没有返回值
var arr = [10,20,30,40,50];
arr.reduce(function(prev,now,index,self){
console.log(prev + "--" + now + "--" + index + "--" + (arr == self))
})
// 打印结果为:第一次,回调函数的第一个参数是数组的第一项。第二个参数就是数组的第二项
// 10--20--1--true
// undefined--30--2--true
// undefined--40--3--true
// undefined--50--4--true
// 此时回调函数没有return,所以从第二次开始,prev拿到的是undefined
//demo3:不省略initial参数,回调函数有返回值
var arr = [10,20,30,40,50];
arr.reduce(function(prev,now,index,self){
console.log(prev + "--" + now + "--" + index + "--" + (arr == self));
return "hello";
}, 2019)
// 打印结果为:
// 2019--10--0--true
// hello--20--1--true
// hello--30--2--true
// hello--40--3--true
// hello--50--4--true
// 此时回调函数有return,所以从第二次开始,prev拿到的是回调函数return的值
//demo4:省略initial参数,回调函数有返回值
var arr = [10,20,30,40,50];
arr.reduce(function(prev,now,index,self){
console.log(prev + "--" + now + "--" + index + "--" + (arr == self));
return "hello";
})
// 打印结果为:第一次,回调函数的第一个参数是数组的第一项。第二个参数就是数组的第二项
// 10--20--1--true
// hello--30--2--true
// hello--40--3--true
// hello--50--4--true
// 此时回调函数有return,所以从第二次开始,prev拿到的是回调函数return的值
//demo5:使用reduce计算数组中所有数据的和
var arr = [10,20,30,40,50];
var sum = arr.reduce(function(prev,now,index,self){
return prev + now;
})
console.log(sum); //150
// 回调函数的最后一次return的结果被返回到reduce方法的身上
//demo6:使用reduce计算数组中所有数据的和
var arr = [10,20,30,40,50];
var sum = arr.reduce(function(prev,now,index,self){
return prev + now;
}, 8)
console.log(sum); //158
// 回调函数的最后一次return的结果被返回到reduce方法的身上
// 因为reduce有第二个参数initial,在第一次执行时被计算,所以最终结果被加上8