Hello!掘金的小伙伴们大家好,我是 摸鱼小公举 ,上一篇文章是我2021的年终总结# 2021年终总结 | 这一切都是最好的安排!,今天是总结了Array相关方法的使用。
Array相关方法的使用详情如下
1,Array.concat()
合并两个或多个数组。此方法不会更改现有数组,而是返回一个新数组。
示例:
const arr1=[1,2,3]
const arr2=[4,5,6]
arr1.concat( arr2 ) // [1,2,3,4,5,6]
2,Aarry.copyWithin()
浅复制数组的一部分到同一数组中的另一个位置,并返回它,不会改变原数组的长度。
示例:
const arr1=[1,2,3,4,5]
arr1.copyWithin(0,3) // [4,5,3,4,5]
3,Array.entries()
返回一个新的Array Iterator对象,该对象包含数组中每个索引的键/值对
示例:
const arr1 = ['a', 'b', 'c'];
const iterators = arr1.entries();
iterators .next().value // [ 0,'a' ]
iterators .next().value // [ 1,'b' ]
4,Array.every()
测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。
示例:
const arr1=[10,20,30,40]
arr1.every((item)=> item/10) //true
5,Array.fill( val,star,end)
用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。
val用来填充数组元素的值。 star起始索引,默认值为0,可选。 end终止索引,默认值为 this.length,可选。
示例:
const arr1=[1,2,3,4,5]
arr1.fill(0,3) // [ 1,2,3,0,0 ]
6,Array.filter()
创建一个新数组, 其包含通过符合条件的所有元素。 返回一个新数组
示例:
const arr1=[1,2,3,4,5]
arr1.filter( item=>item>3 ) // [ 4,5]
7,Array.find()
返回数组中满足条件的第一个元素的值。否则返回undefined。
示例:
const arr1=[1,2,3,4,5]
arr1.find( item=>item>3 ) // 4
8,Array.findIndex()
返回数组中满足提供的测试函数的第一个元素的索引。若没有找到对应元素则返回-1。
示例:
const arr1=[1,2,3,4,5]
arr1.findIndex( item=>item>3 ) // 3
9,Array.flat()
会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
示例:
const arr1=[1,2,3,[ 4,5 ] ]
const arr2=[1,2,3,[[[4,5 ]]] ]
arr1.flat( ) // [1,2,3, 4,5 ]
arr2.flat( 2 ) // [1,2,3,[ 4,5 ] ]
10,Array.flatMap()
首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与 map连着深度值为1的 flat 几乎相同,但 flatMap 通常在合并成一种方法的效率稍微高一些。
示例
const arr1 = [1, 2, 3, 4];
arr1.map(x => [x * 3]); // [[3], [6], [9], [12]]
arr1.flatMap(x => [x * 3]); // [3, 6, 9, 12]
11,Array.forEach()
对数组的每个元素执行一次给定的函数。return不会终止此函数的循环
示例:
const arr1 = [1, 2, 3];
arr1 .forEach(item=>{
console.log(item)
}) // 1 //2 //3
12,Array.from()
对一个类似数组或可迭代对象创建一个新的,浅拷贝的数组实例。
示例:
console.log(Array.from('123')); // ["1", "2", "3"]
console.log(Array.from([1, 2, 3], x => x *2)); //[ 2,4,6 ]
用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。
13,Array.includes()
用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。
示例:
const arr1 = [1, 2, 3];
arr1.includes(3) //true
14,Array.indexOf()
返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。
示例:
const arr1 = [1, 2, 3];
arr1.indexOf(3) //2
15,Array.isArray()
用于确定传递的值是否是一个 Array
示例:
Array.isArray([1, 2, 3]);// true
Array.isArray({num: 123});// false
16,Array.join()
将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串。如果数组只有一个项目,那么将返回该项目而不使用分隔符。
示例
const arr1 = ['1',' 2', '3'];
arr1.join() // 1,2,3
arr1.join(' ') // 123
17, Array.keys()
返回一个包含数组中每个索引键的Array Iterator对象。
示例:
const arr1 = ['a',' b', 'c'];
const objs=arr1.keys()
for (const key of objs) {
console.log(key);
} //0 //1 //2
18, Array.lastIndexOf()
返回指定元素(也即有效的 JavaScript 值或变量)在数组中的最后一个的索引,如果不存在则返回 -1。从数组的后面向前查找,从 fromIndex 处开始。
示例:
const arr1 = [1,2,3,4];
arr1.lastIndexOf(2) //2
arr1.lastIndexOf(5) //-1
19, Array.map()
返回一个新数组,可用于普通遍历,也可以用于提取数组对象中某个key的value。
示例:
const arr1=[{name:'Amy',id:1},{name:'Tom',id:2}]
arr1.map(item=>item.id) //[1, 2]
20,Array.of()
创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型。
Array.of() 和Array构造函数之间的区别在于处理整数参数: Array.of(2) 创建一个单个元素的数组,而 Array(2) 创建一个长度为2的空数组
示例:
Array.of(2) //[2]
Array.of(2,3,4) //[2,3,4]
Array(2) //['','']
21,Array.pop()
从数组中删除最后一个元素,并返回该元素的值。此方法更改数组的长度。
示例:
const arr1 = [1,2,3,4];
arr1.pop() //[1,2,3]
22,Array.push()
将一个或多个元素添加到数组的末尾,并返回该数组的新长度。
示例:
const arr1 = [1,2,3,4];
arr1.push(5,6) //[1,2,3,4,5,6]
23,Array.prototype.reduce()
对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值,也就是常说的累加。
示例:
const arr1 = [1,2,3,4];
arr1.reduce((a,b)=>a+b) //10
24,Array.reduceRight()
接受一个函数作为累加器(accumulator)和数组的每个值(从右到左)将其减少为单个值。
示例:
const array1 = [[0, 1], [2, 3], [4, 5]].reduceRight(
(a, b) => a.concat(b)
); //[ [4, 5],[2, 3],[0, 1]]
array.reduceRight(function(accumulator, currentValue, index, array) {
callback 一个回调函数,用于操作数组中的每个元素,它可接受四个参数:
accumulator 累加器:上一次调用回调函数时,回调函数返回的值。
currentValue 当前元素:当前被处理的元素。
index,可选 ,数组中当前被处理的元素的索引。
array,可选,调用 `reduceRight()` 的数组。
initialValue,可选 首次调用 `callback` 函数时,累加器 `accumulator` 的值。
});
25,Array.reverse()
该方法会改变原数组。数组翻转,最后一个到第一个,第一个到最后一个依此类推
示例:
const arr1 = [1,2,3,4];
arr1.reverse() // [4,3,2,1]
26,Array.shift()
从数组中删除第一个元素,并返回该元素的值。此方法更改数组的长度。
示例:
const arr1 = [1,2,3,4];
arr1.shift() // [2,3,4]
27,Array.slice()
返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括begin,不包括end)。原始数组不会被改变。
示例:
const arr1 = [1,2,3,4];
arr1.slice(2) //[3,4]
console.log(arr1) //[1,2,3,4]
28,Array.some()
测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
示例:
const arr1 = [1,2,3,4];
arr1.some(item=>item/2) //true
29, Array.sort()
数组升序,改变原数组
示例:
这是大于0的正整数
const arr1 = [4,3,2,1];
arr1.sort() //[1,2,3,4]
这里是小于0的负整数
const arr2 = [-1,2,-3,4];
let num= arr2.sort(function (a, b) {
return a - b;
}); // [-3, -1, 2, 4]
30,Array.splice()
通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
示例:
const arr1 = [1,2,3,4,5];
arr1.splice(1,1) //[1,3,4,5]
或 arr1.splice(1,1,6) ////[1,6,3,4,5]
或 arr1.splice(1,0,6) ////[1,6,2,3,4,5]
31,Array.toLocaleString()
返回一个字符串表示数组中的元素。数组中的元素将使用各自的 toLocaleString 方法转成字符串,这些字符串将使用一个特定语言环境的字符串(例如一个逗号 ",")隔开。
示例:
const arr1 = [A,2,3,4,5];
arr1.toLocaleString() //'1,2,3,4,5'
32,Array.toString()
返回一个字符串,表示指定的数组及其元素。
示例:
const arr1 = [1,2,3,4,5];
arr1.toString() // '1,2,3,4,5'
Array.toLocaleString()与Array.toString() 有什么区别?
在数字转换成字符串的时候,并没有感觉这两个方法有什么区别
区别一:当数字是四位及以上时,toLocaleString()会让数字三位三位一分隔
var a=1234
a.toString() // '1234'
a.toLocaleString() // '1,234'
区别二:转换时间格式上有区别
var sd=new Date() // Thu Dec 23 2021 14:55:19 GMT+0800 (中国标准时间)
sd.toString() // 'Thu Dec 23 2021 14:55:59 GMT+0800 (中国标准时间)'
sd.toLocaleString() // 2021/12/23 下午2:56:58
33,Array.unshift()
将一个或多个元素添加到数组的开头,并返回该数组的新长度(该方法修改原有数组) 。
示例:
const arr1 = [1,2,3];
arr1.unshift(4,5) //[4,5,1,2,3]
34,Array.values()
返回一个新的 Array Iterator对象,该对象包含数组每个索引的值
示例:
const arr1 = [1,2,3];
const objs=arr1.values()
for (const value of objs) {
console.log(key);
} //1 //2 //3
结语
总结这些方法时我自己又重新复习了一边,记忆更加深刻了,同时也是温故而知新;这篇文章希望对大家有帮助;( 点赞+评论+关注 ) 有问题可以来互相交流一下