目录
var color=["red","yellow","blue"]
console.log(color)//red,yellow,blue
一:poping和pushing
pop() 方法从数组中删除最后一个元素
color.pop()
console.log(color)//red,yellow
push() 方法(在数组结尾处)向数组添加一个新的元素
二:shift和unshift
shift() 方法从数组中删除第一个元素
console.log(color)//red,yellow,green
color.shift()
console.log(color)//yellow,green
unshift() 方法(在数组开头处)向数组添加一个新的元素
color.unshift("white")
console.log(color)//white,yellow,green
三:splice和slice
splice() 方法可以在数组任意位置增加,删除一定数量的元素
3.1.1:使用splice()方法删除元素
console.log(color)//red,yellow,blue
color.splice(1,2)
console.log(color)//red
第一个参数(1)定义了应添加新元素的位置。
第二个参数(2)定义应删除多少元素。
注意:这里第二个参数如果大于数组剩下的元素个数,只删除剩下所有的元素,不报错。
即:
console.log(color)//red,yellow,blue
color.splice(1,3)
console.log(color)//red
3.1.2:使用splice()方法增加元素
console.log(color)//red,yellow,blue
color.splice(2,0,"pink","gray")
console.log(color)//red,yellow,pink,gray,blue
第一个参数(2)定义了应添加新元素的位置。
第二个参数(0)定义应删除多少元素。
其余参数(“pink”,“gray”)定义要添加的新元素。
slice() 方法用数组的某个片段切出新数组。它不会改变原数组。
console.log(color)//red,yellow,blue
var newColor=color.slice(1,2)
console.log(newColor)//yellow
console.log(color)//red,yellow,blue
第一个参数(1)定义了开始的位置。
第二个参数(2)定义了结束的位置。
没有第二个元素的情况下,默认结束位置到数组最后。
四:concat
concat() 方法合并数组。并不会改变原数组,可以合并任意数量的数组参数。
var color=["red","yellow","blue"]
var fruit=["banana","apple","orange"]
var city=["beijin","tianjin","shanhai"]
var newArr1=color.concat("black")//合并数组和值
var newArr2=color.concat(fruit)//合并两个数组
var newArr3=color.concat(fruit,city)//合并两个数组
console.log(color)//red,yellow,blue
console.log(newArr1)//red,yellow,blue,black
console.log(newArr2)//red,yellow,blue,banana,apple,orange
console.log(newArr3)//red,yellow,blue,banana,apple,orange,beijin,tianjin,shanghai
五:toString()
把数组转换成字符串
var color=["red","yellow","blue"]
var newColor=color.toString()
console.log(color)
console.log(newColor)
输出:
六:sort 和reverse
sort()方法对数组进行排序
var color=["red","yellow","blue"]
var num=[2,4,3,6]
var ch=["2","4","60","1","33"]
color.sort()
console.log(color)//blue,red,yellow
console.log(num.sort())//2,3,4,6
console.log(ch.sort())//1,2,33,4,60
reverse ()方法反转数组中的元素。
var color=["red","yellow","blue"]
color.reverse()
console.log(color)//blue,yellow,red
七:forEach和map
forEach()方法遍历数组。
var num=[1,3,2,45]
var res= num.forEach(function(value, index, array){
array[index]=value+1
},this)
console.log(res)//undefined
console.log(num)//2,4,3,46
function为数组中每个元素需要执行的函数,最多可以有三个值,value表示当前元素项,是必需参数,index表示当前元素的下标,非必需,array表示当前元素所属的数组,非必需。this表示执行函数时this的指向,默认指向window全局。可以改变原数组,不支持return,跳过空值。
map()方法遍历数组。
var num=[1,3,2,45]
var res=num.map(function(value,index,arr){
return value+1
},this)
console.log(res)//2,4,3,46
console.log(num)//1,3,2,45
function为数组中每个元素需要执行的函数,最多可以有三个值,value表示当前元素项,是必需参数,index表示当前元素的下标,非必需,array表示当前元素所属的数组,非必需。this表示执行函数时this的指向,默认指向window全局。不改变原数组,支持return返回值,跳过空值。
八:fliter和map
filter() 方法创建一个包含通过测试的数组元素的新数组。
var num=[1,3,2,45]
var res1=num.map(function(value,index,arr){
return value>2
},this)
var res2=num.filter(function(value,index,arr){
return value>2
},this)
console.log(res1)//false, true, false, true
console.log(res2)//3,45
console.log(num)//1,3,2,45
function为数组中每个元素需要执行的函数,最多可以有三个值,value表示当前元素项,是必需参数,index表示当前元素的下标,非必需,array表示当前元素所属的数组,非必需。this表示执行函数时this的指向,默认指向window全局。不改变原数组,支持return返回值,跳过空值。
九:reduce和reduceRight
reduce()方法和reduceRight()方法可以做很多事情,具体就先不写了。
arr.reduce(function(total,value,index,arr){},[initialValue])
function为数组中每个元素需要执行的函数,最多可以有四个值,total表示初始值(或者上一次回调函数的返回值),是必需参数。value表示当前元素项,是必需参数。index表示当前元素的下标,非必需,arr表示当前元素所属的数组,非必需。initialValue表示第一次调用function函数的参数位置。不改变原数组,支持return返回值,跳过空值。
var num=[1,3,2,45]
var res=num.reduce(function(total,value,index,arr){
console.log(total,value,index)
return total+value;
})
console.log(num)//1,3,2,4,5
console.log(res)//51
var num=[1,3,2,45]
var res=num.reduce(function(total,value,index,arr){
console.log(total,value,index)
return total+value;
},0)
console.log(num)//1,3,2,4,5
console.log(res)//51
initialValue未设置的情况下,会从数组第一个(下标为[1])元素开始执行。且在数组为空的时候报错。
var num=[]
var res=num.reduce(function(total,value,index,arr){
console.log(total,value,index)
return total+value;
})
console.log(num)
console.log(res)
//err
var num=[]
var res=num.reduce(function(total,value,index,arr){
console.log(total,value,index)
return total+value;
})
console.log(num)//[]
console.log(res)//0
reduceRight()方法和reduce方法类型,不过是从右往左开始工作(reduce()方法是从左往右开始工作)。
var num=[1,3,2,45]
var res=num.reduceRight(function(total,value,index,arr){
console.log(total,value,index)
return total+value;
},0)
console.log(num)//1,3,2,45
console.log(res)//51
十:every和some
every() 方法检查所有数组值是否通过测试。(这里1,2《=2)
var num=[1,3,2,45,]
var res=num.every(function(value,index,arr){
return value>2;
},0)
console.log(num)//1,3,2,45
console.log(res)//false
some() 方法检查某些数组值是否通过了测试。(这里3,45》2)
var num=[1,3,2,45,]
var res=num.some(function(value,index,arr){
return value>2;
},0)
console.log(num)//1,3,2,45
console.log(res)//true
十一:indexOf和lastIndexOf
indexOf() 方法在数组中搜索元素值并返回其位置。如果有重复的元素,返回第一个的位置。
lastIndexOf()方法和indexOf()方法类似,不过它是在有重复的元素情况下,返回最后一个元素的位置。
var f=["banana","orange","apple","mango","orange"]
console.log(f.indexOf("orange"))//1
console.log(f.lastIndexOf("orange"))//4
十二:find和findIndex
find() 方法返回通过测试函数的第一个数组元素的值。
findIndex() 方法返回通过测试函数的第一个数组元素的索引。
var num=[1,3,2,45]
var vNum=num.find(function(value,index,arr){
return value>2
},this)
var iNum=num.findIndex(function(value,index,arr){
return value>2
},this)
console.log(vNum)//3
console.log(iNum)//1