视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
javascript中对数组的方法的总结(附代码)
2020-11-27 19:31:47 责编:小采
文档

本篇文章给大家带来的内容是关于javascript中对数组的方法的总结(附代码) ,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

1.copyWithin() 方法 会改变原数组
复制数组的前面两个元素到后面两个元素上:
array.copyWithin(target, start, end)
参数 描述
target 必需。复制到指定目标索引位置。
start 可选。元素复制的起始位置。
end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。

var arr = [1,2,3,4,5];
arr.copyWithin(3,0,2);
console.log(arr); //1,2,3,1,2

2.every(function(){}) 不会改变原数组
给数组的每一项都运行一个函数,如果每一项都返回true,则返回true;

var arr=[1,2,3,4,5];
var result=arr.every(function(item){
 return item>1;
})
console.log(result); //false

3.some(function(){}) 不会改变原数组
给数组的每一项都运行一个函数,如果有一项返回true,则返回true;

var arr=[1,2,3,4,5]
var result=arr.some(function(item){
 return item>1;
})
console.log(result) //true

4.fill() 使用一个固定值来填充数组 会改变原数组
array.fill(value, start, end)
参数 描述
value 必需。填充的值。
start 可选。开始填充位置。
end 可选。停止填充位置 (默认为 array.length)

var arr=[1,2,3,4,5];
arr.fill("哈哈",0,3);
console.log(arr); //[ '哈哈', '哈哈', '哈哈', 1, 2 ]

5.filter() 不会改变原始数组
创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。
注意: filter() 不会对空数组进行检测。

var ages = [22, 53, 16, 40];
var ar5=ages.filter(function(age){
 return age>30;
})
console.log(ar5) //[ 53, 40 ]

6.find() 不会改变原始数组
返回通过测试(函数内判断)的数组的第一个元素的值。
find() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 undefined
注意: find() 对于空数组,函数是不会执行的。

var num = [212, 537, 160, 401];
function odd(x){
 return x%2;
}
var ar6=num.find(odd);
console.log(ar6); //537

7.findIndex() 不会改变原数组
返回传入一个测试条件(函数)符合条件的数组第一个元素位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。

var num = [212, 537, 160, 401];
function odd(x){
 return x%2;
}
console.log(num.findIndex(odd)); //1

8.indexOf() 不会改变原数组
搜索数组中的元素,并返回它所在的位置。

var num = [212, 537, 160, 401];
console.log(num.indexOf(160)); //2

9.lastIndexOf() 不会改变原数组
返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索。

var num = [212, 537, 160, 401];
console.log(num.indexOf(160)); //

10.join() 会改变原数组
把数组转化为字符串,元素是通过指定的分隔符进行分隔的,如果没有默认为逗号
toString() 会改变原数组
把数组转换为字符串,并返回结果,没有参数

var num = [212, 537, 160, 401];
console.log(num.join()); //212,537,160,401

11.map() 不会改变原数组
通过指定函数处理数组的每个元素,并返回处理后的数组

var arr=[12,23,45,56,78];
var arr1=arr.map(function(x){
 return x+1;
})
console.log(arr1); //[ 13, 24, 46, 57, 79 ]
console.log(arr); //[ 12, 23, 45, 56, 78 ]

12.forEach() 不会改变原数组
方法用于调用数组的每个元素,并将元素传递给回调函数。
注意: forEach() 对于空数组是不会执行回调函数的

var num=[ 212, 537, 160, 401 ];
num.forEach(function(num){
 return num/2;
})
console.log(num); //[ 212, 537, 160, 401 ]

13.reduce() 不会改变原数组
接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce() 可以作为一个高阶函数,用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的

var arr=[ 12, 23, 45, 56, 78 ];
var arr2=arr.reduce(function(total,item){
 return total-item;
})
console.log(arr2); //-190
console.log(arr); //[ 12, 23, 45, 56, 78 ]

14.reduceRight() 不会改变原数组
功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。
注意: reduce() 对于空数组是不会执行回调函数的

var arr=[ 12, 23, 45, 56, 78 ];
var arr2=arr.reduceRight(function(total,item){
 return total-item;
})
console.log(arr2); //-58
console.log(arr); //[ 12, 23, 45, 56, 78 ]

15.pop() 会改变原数组
删除数组的最后一个元素并返回删除的元素。没有参数
shift() 会改变原数组
删除并返回数组的第一个元素。没有参数
push() 会改变原数组
向数组的末尾添加一个或更多元素,并返回新的长度。参数为要添加的元素,可以为一个或多个
unshift() 会改变原数组
向数组的开头添加一个或更多元素,并返回新的长度。参数为要添加的元素,可以为一个或多个

16.sort() 会改变原数组
对数组的元素进行排序,只能是一位数,如果是两位数会按字典序排列,改进:加一个回调函数

var arr2=[2,8,45,12,5,67,9];
arr2.sort(function(a,b){
 return a-b;
});
console.log(arr2); //[ 2, 5, 8, 9, 12, 45, 67 ]

17.reverse() 会改变原数组
反转数组的元素顺序

var arr2=[ 2, 5, 8, 9, 12, 45, 67 ];
arr2.reverse();
console.log(arr2); //[ 67, 45, 12, 9, 8, 5, 2 ]

18.valueOf() 不会改变原数组
返回数组对象的原始值,一般原样返回

var arr2=[ 67, 45, 12, 9, 8, 5, 2 ];
arr2.valueOf();
console.log(arr2); //[ 67, 45, 12, 9, 8, 5, 2 ]
// 可以自己定义一个对象的valueOf()方法来覆盖它原来的方法。
// 这个方法不能含有参数,方法里必须return一个值。
var x = {};
x.valueOf = function(){
 return 10;
}
console.log(x+1);// 
输出10 console.log(x+"hello");//输出10hello

19.slice() 不会改变原数组
选取数组的的一部分,并返回一个新数组。
array.slice(start, end)
参数 描述
start 可选。规定从何处开始选取(包括)。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元 素,-2 指倒数第二个元素,以此类推。
end 可选。规定从何处结束选取(不包括)。该参数是数组片断结束处的数组下标。
如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。
如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

var arr2=[ 67, 45, 12, 9, 8, 5, 2 ];
console.log(arr2.slice(1,4)); //[ 45, 12, 9 ]
console.log(arr2); //[ 67, 45, 12, 9, 8, 5, 2 ]

20.splice() 会改变原始数组
方法用于插入、删除或替换数组的元素。
array.splice(index,howmany,item1,.....,itemX)
参数 描述
index 必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX 可选。要添加到数组的新元素

arr3=[2,3,4,5,6,7,8];
//删除
arr3.splice(2,3);
console.log(arr3); //[ 2, 3, 7, 8 ]
//增加
arr3.splice(1,0,9,10);
console.log(arr3); //[ 2, 9, 10, 3, 7, 8 ]
//替换
arr3.splice(0,3,8,7,3); //[ 8, 7, 3, 3, 7, 8 ]
console.log(arr3);

最后再小结一下:

会改变原数组的方法:copyWithin()、fill()、join()、pop()、push()、shift()、unshift()、sort()、reverse()、splice();

不会改变原数组的方法:every()、some()、filter()、find()、findIndex()、indexOf()、lastIndexOf()、map()、forEach()、reduce()、reduceRight()、valueOf()、slice();

下载本文
显示全文
专题