javascript中数组的方法(最全)

javascript中数组的方法

join()

数组转字符串,方法只接收一个参数:即默认为逗号分隔符()。

    var arr = [1,2,3]
    console.log(arr.join(':'))//1:2:3

利用join()实现重复字符串

    function repeatStr(str, n) {
        return new Array(n + 1).join(str);
    }
	console.log(repeatStr("1",4)); //1111

push()

该方法可向数组的末尾添加一个或多个元素,并返回新的长度。

    var arr = [1,2,3]
    arr.push(4,5)
    console.log(arr)// [1, 2, 3, 4, 5]
    console.log(arr.push(4,5))// 7

pop()

该方法用于删除并返回数组的最后一个元素。

    var arr = [1,2,3]
    arr.pop()
    console.log(arr)// [1, 2]
    console.log(arr.pop())// 2

shift()

该方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。

    var arr = [1,2,3]
    arr.shift()
    console.log(arr)// [2, 3]
    console.log(arr.shift())// 2

unshift()

该方法可向数组的开头添加一个或更多元素,并返回新的长度。

    var arr = [1,2,3]
    arr.unshift(2,3)
    console.log(arr)// [2, 3, 1, 2, 3]
    console.log(arr.unshift(2,3))// 7

sort()

该方法用于对数组的元素进行排序。它返回新的数组,并且原数组会发生改变。

    var arr = [1,2,3,'q','a',4,0]
    arr.sort()
    console.log(arr)//[0, 1, 2, 3, 4, 'a', 'q']
    console.log(arr.sort())// [0, 1, 2, 3, 4, 'a', 'q']

以上方法仅仅是根据字符编码的顺序进行排序,如果需要按照大小等排序,就必须使用一个排序函数:

升序:

    var arr = [1,2,3,4,0]
    function sortNumber(a,b){return a - b}
    arr.sort(sortNumber)
    console.log(arr)//[0, 1, 2, 3, 4]
    console.log(arr.sort(sortNumber))// [0, 1, 2, 3, 4]

降序:

    var arr = [1,2,3,4,0]
    function sortNumber(a,b){return b - a}
    arr.sort(sortNumber)
    console.log(arr)//[4, 3, 2, 1, 0]
    console.log(arr.sort(sortNumber))// [4, 3, 2, 1, 0]

reverse()

该方法用于颠倒数组中元素的顺序。

    var arr = [1,2,3,4,0]
    arr.reverse()
    console.log(arr)//[0, 4, 3, 2, 1] 原数组改变
    console.log(arr.reverse())// [1, 2, 3, 4, 0]

concat()

concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。在没有给 concat()方法传递参数的情况下,它只是复制当前数组并返回副本。如果参数中存在二维数组也会连接。

    var arr = [1,2,3,4,0]
    var arr2 = [2,3,4,5,6]
    var newArr = arr.concat(arr2)
    console.log(arr)//[1, 2, 3, 4, 0] 原数组未改变
    console.log(newArr)// [1, 2, 3, 4, 0, 2, 3, 4, 5, 6]
    var arr3 = [2,3,[1,2,3],5,6]
    var newArr2 =arr.concat(arr3)
    console.log(newArr2)// [1, 2, 3, 4, 0, 2, 3, Array(3), 5, 6]

slice()

该方法用于数组截取。
语法:arr.slice(start , end);

start:可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

返回值:返回一个新的数组,包含从 start 到 end (不包括该元素)的 arr 中的元素。

    var arr = [1,2,3,4,0]
    var newArr = arr.slice(1,-1)
    var newArr2 = arr.slice(1,5)
    var newArr3 = arr.slice()
    console.log(arr)//[1, 2, 3, 4, 0] 原数未组改变
    console.log(newArr)// [2, 3, 4]
    console.log(newArr2)// [2, 3, 4, 0]
    console.log(newArr3)// [1, 2, 3, 4, 0]

splice()

splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目,该方法会改变原始数组。
语法:arr.splice(index , howmany , item1,…,itemX)
index:必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。

howmany:必需。要删除的项目数量。如果设置为 0,则不会删除项目。

item1, …, itemX:可选。向数组添加的新项目。

返回值:含有被删除的元素的数组,若没有删除元素则返回一个空数组。

    var arr = [1,2,3,4,0,2,1,1,2,3,1]
    var newArr = arr.splice(1,2,6,6,6)
    console.log(arr)//[1, 6, 6, 6, 4, 0, 2, 1, 1, 2, 3, 1] 原数组改变
    console.log(newArr)// [2, 3] 返回被删除的内容
    var newArr2 = arr.splice(-1,5,0,0,0) 
    console.log(arr)// [1, 6, 6, 6, 4, 0, 2, 1, 1, 2, 3, 0, 0, 0]  -1之后不够5个
    console.log(newArr2)// [1]
    var newArr3 = arr.splice(1,0,1,1,1) 
    console.log(arr) //[1, 1, 1, 1, 6, 6, 6, 4, 0, 2, 1, 1, 2, 3, 0, 0, 0]
    console.log(newArr3)// [] 返回空数组

ES5新增的数组的方法

indexOf() lastIndexOf()

两个方法都返回要查找的项在数组中首次出现的位置,在没找到的情况下返回-1。
indexOf()语法:array.indexOf(item,start) (从数组的开头(位置 0)开始向后查找)
item: 必须。查找的元素。
start:可选的整数参数。规定在数组中开始检索的位置。如省略该参数,则将从array[0]开始检索。

    var arr = [1,2,3,4,0,2,1,1,2,3,1]
    var newArr = arr.indexOf(1,2)
    console.log(arr)//[1, 2, 3, 4, 0, 2, 1, 1, 2, 3, 1] 原数组未改变
    console.log(newArr)// 6 返回被查找到的内容的索引值

lastIndexOf()语法:array.lastIndexOf(item,start) (从数组的末尾开始向前查找)
item: 必须。查找的元素。
start:可选的整数参数。规定在数组中开始检索的位置。如省略该参数,则将从 array[array.length-1]开始检索。

    var arr = [1,2,3,4,0,2,1,1,2,3,1]
    var newArr = arr.lastIndexOf(1,7)
    console.log(arr)//[1, 2, 3, 4, 0, 2, 1, 1, 2, 3, 1] 原数组未改变
    console.log(newArr)// 7 返回被查找到的内容的索引值

5个迭代方法

这几个方法语法都一样,都不会改变原数组。

forEach()

对数组进行遍历循环,这个方法没有返回值。jquery()也提供了相应的方法each()方法。
语法:array.forEach(function(currentValue , index , arr){//do something}, thisValue)
currentValue : 必需。当前元素
index: 可选。当前元素的索引值。
arr : 可选。当前元素所属的数组对象。
thisValue: 可选。传递给函数的值一般用 “this” 值。如果这个参数为空, “undefined” 会传递给 “this” 值。

    var arr = [1,2,3,4]
    var newArr = arr.forEach(function(item,index,arr){
        item=item+'岁'
        console.log(index+'---'+item+'---'+arr)
        console.log(this)//window
    },this)
    /*
    0---1岁---1,2,3,4
    1---2岁---1,2,3,4
    2---3岁---1,2,3,4
    3---4岁---1,2,3,4
    */
    console.log(arr)//[1, 2, 3, 4] 原数组未改变
    console.log(newArr)// undefind 没有返回值
    console.log(this)//window
map()

指“映射”,方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
语法:array.map(function(currentValue , index , arr){//do something}, thisValue)

    var arr = [1,2,3,4]
    var newArr = arr.map(function(item){
        return item*5
    },this)
    console.log(arr)//[1, 2, 3, 4] 原数组未改变
    console.log(newArr)// [5, 10, 15, 20]
filter()

“过滤”功能,方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。和filter() 方法类似,jquery中有个 grep()方法也用于数组元素过滤筛选。
语法: array.filter(function(currentValue , index , arr){//do something}, thisValue)

    var arr = [1,2,3,4]
    var newArr = arr.filter(function(item,index){
        return index<2 && item<2
    },this)
    console.log(arr)//[1, 2, 3, 4] 原数组未改变
    console.log(newArr)// [1] 返回索引值小于2并且值小于2的新数组
every()

判断数组中每一项都是否满足条件,只有所有项都满足条件,才会返回true。
语法: array.every(function(currentValue , index , arr){//do something}, thisValue)

    var arr = [1,2,3,4]
    var newArr = arr.every(function(item,index){
        return item>0
    },this)
    console.log(arr)//[1, 2, 3, 4] 原数组未改变
    console.log(newArr)// true
some()

判断数组中是否存在满足条件的项,只要有一项满足条件,就会返回true。
语法: array.some(function(currentValue , index , arr){//do something}, thisValue)

    var arr = [1,2,3,4]
    var newArr = arr.some(function(item,index){
        return item>5
    },this)
    console.log(arr)//[1, 2, 3, 4] 原数组未改变
    console.log(newArr)// false

2个归并方法

reduce() reduceRight()

这两个方法都会迭代数组中的所有项,然后生成一个最终返回值。他们都接收两个参数,第一个参数是每一项调用的函数,函数接受四个参数分别是初始值,当前值,索引值,和当前数组,函数需要返回一个值,这个值会在下一次迭代中作为初始值。第二个参数是迭代初始值,参数可选,如果缺省,初始值为数组第一项,从数组第一个项开始叠加,缺省参数要比正常传值少一次运算。reduce()方法从数组的第一项开始,逐个遍历到最后。而 reduceRight()则从数组的最后一项开始,向前遍历到第一项。
reduce()语法:arr.reduce(function(total , cur , index , arr){//do something}, initialValue)
reduceRight()语法:arr.reduceRight(function(total , cur , index , arr){//do something}, initialValue)
total :必需。初始值, 或者计算结束后的返回值。
cur :必需。当前元素。
index :可选。当前元素的索引。
arr:可选。当前元素所属的数组对象。
initialValue:可选。传递给函数的初始值。

ES6数组新增方法

Array.from()

该方法是用于类似数组的对象(即有length属性的对象)和可遍历对象转为真正的数组。

let obj = {
    "0":"唱歌",
    "1":"跳舞",
    "2":"篮球",
    "3":"游泳",
    length:4
}
let arr = Array.from(obj)
console.log(arr)//['唱歌', '跳舞', '篮球', '游泳']

Array.of()

该方法是将一组值转变为数组,参数不分类型,只分数量,数量为0返回空数组。

	let arr1 = Array.of(1,2,3);	
	let arr2 = Array.of([1,2,3]);
	let arr3 = Array.of(undefined);
	let arr4 = Array.of();
	console.log(arr1); // [1, 2, 3]
	console.log(arr2); // [[1, 2, 3]]
	console.log(arr3); // [undefined]
	console.log(arr4); // []

find()

该方法返回通过测试(函数内判断)的数组的第一个元素的值。数组中的每个元素都调用一次函数执行。当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。如果没有符合条件的元素返回 undefined。
回调函数可以接收3个参数,依次为当前的值(currentValue)、当前的位置(index)、原数组(arr)

注意:find() 对于空数组,函数是不会执行的。find() 并没有改变数组的原始值。

let arr = [2,3,5,7,8,0]
let newArr = arr.find(function(item,index,arr){
    return item>2 && index<4
})
console.log(arr)//[2, 3, 5, 7, 8, 0] 原数组未改变
console.log(newArr)// 3 返回第一个符合条件的值

findIndex ()

findIndex和find差不多,不过默认返回的是索引,如果没有符合条件的元素返回 -1。

let arr = [2,3,5,7,8,0]
let newArr = arr.findIndex(function(item,index,arr){
    return item>2 && index<4
})
console.log(arr)//[2, 3, 5, 7, 8, 0] 原数组未改变
console.log(newArr)// 1 返回第一个符合条件的索引值

fill()

fill()方法用一个固定值填充一个数组中从起始索引到终止索引内的全部元素,不包括终止索引。
语法:array.fill(value, start, end)
value:必需。填充的值。
start:可选。开始填充位置。如果这个参数是负数,那么它规定的是从数组尾部开始算起。
end:可选。停止填充位置 (默认为 array.length)。如果这个参数是负数,那么它规定的是从数组尾部开始算起。

    let arr = [1,2,3,4,5,6];
    arr.fill(0);  // [0, 0, 0, 0, 0, 0]
    arr.fill(0,1);  // [1, 0, 0, 0, 0, 0] 
    arr.fill(0,1,2);  // [1, 0, 3, 4, 5, 6]
    arr.fill(0,-1);  // [1, 2, 3, 4, 5, 0]
    arr.fill(0,1,-1);  // [1, 0, 0, 0, 0, 6]

遍历数组方法keys()、values()、entries()

这三个方法都是返回一个遍历器对象,可用for…of循环遍历,唯一区别:keys()是对键名的遍历、values()对键值的遍历、entries()是对键值对的遍历。

let arr = [2,3,5]
for (let i of arr.keys()) {
    console.log(i)
    /*
     0
     1
     2
    */
}
for (let i of arr.values()) {
    console.log(i)
    /*
     2
     3
     5
    */
}
for (let i of arr.entries()) {
    console.log(i)
    /*
     [0, 2]
     [1, 3]
     [2, 5]
    */
}

includes()

该方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
语法:arr.includes(searchElement , fromIndex)
searchElement : 必须。需要查找的元素值。
fromIndex:可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。

	let arr = ["a","b","c","d"];
	let result1 = arr.includes("b");
	let result2 = arr.includes("b",2);
	let result3 = arr.includes("b",-1);
	let result4 = arr.includes("b",-3);
	console.log(result1);  // true
	console.log(result2);  // false
	console.log(result3);  // flase
	console.log(result4);  // true

copyWithin()

语法:array.copyWithin(target , start , end)
target :必需。从该位置开始替换数据。
start :可选。从该位置开始读取数据,默认为 0 。如果为负值,表示倒数。
end: 可选。到该位置前停止读取数据,默认等于数组长度。如果为负值,表示倒数。

let arr = [2,3,5,4,8]
let newArr = arr.copyWithin(1,0,2)
console.log(arr) // [2, 2, 3, 4, 8] 原数组发生改变
console.log(newArr) // [2, 2, 3, 4, 8]
  • 2
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小婵婵不怕鬼

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值