JS集合-Array操作方法

常见的对数组中元素操作方法

1.concat 合并

concat(): 在现有数组的全部元素基础上拷贝副本并创建一个新数组,将方法中所有参数添加到新数组末尾,并返回这个新数组; 原数组不受影响

强制不打平数组: concat()方法默认是打平数组参数,打平数组参数行为可以重写。需要在参数数组上指定一个特殊的符号:Symbol.isConcatSpreadable=false.  (强制打平,参数数组Symbol.isConcatSpreadable=true)

  

2.slice() 切割

slice() 用来创建一个包含原有数组中一个或多个元素的新数组。 slice() 方法不影响原始数组。

 

slice() 只有一个参数,则返回该索引到数组末尾的所有元素;

slice() 有两个参数,则返回从开始索引到结束索引对应的所有元素,其中不包含结束索引对应的元素。

 

3.splice() 粘接

有3中方式使用这个方法:主要目的是在数组中间插入元素。

splice() 删除:需要传2个参数, 如:splice(0,2) 从索引0开始删除2个元素。 第一个参数表示要删除的元素位置,第二个参数表示要删除的元素数量;

splice() 插入: 需传3个或以上参数,开始位置,0(要删除的元素数量),和要插入的元素。 如splice(2,0,"red","green") 从索引2开始插入字符串“red”和“green”;

splice() 替换: 需传3个或以上参数,开始位置,要删除的元素数量,要插入的新元素; 如splice(2,1,"red","green") 在索引2位置删除一个元素,然后从该位置向数组插入“red”和“green”;

 

4.搜索和位置方法

严格相等的搜索方法:indexOf()、lastIndexOf() 和 includes().

indexOf() 从数组前头开始向后搜索,返回要查找的元素在数组中的位置; 两个参数:第一个参数表示要查找的元素,第二个参数可选,表示开始搜索的位置;

 includes() 从数组前头开始向后搜索,数组中是否含有要查找的元素。返回boolean 值;

lastIndexOf() 从数组末尾向前搜索,返回要查找的元素在数组中的位置;两个参数:第一个参数表示要查找的元素,第二个参数可选,表示开始搜索的位置;

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
alert(numbers.indexOf(4)); // 3
alert(numbers.lastIndexOf(4)); // 5
alert(numbers.includes(4)); // true
alert(numbers.indexOf(4, 4)); // 5 ,
alert(numbers.lastIndexOf(4, 4)); // 3
alert(numbers.includes(4, 7)); // false
let person = { name: "Nicholas" };
let people = [{ name: "Nicholas" }];
let morePeople = [person];
alert(people.indexOf(person)); // -1
alert(morePeople.indexOf(person)); // 0
alert(people.includes(person)); // false
alert(morePeople.includes(person)); // true
 
以上三个方法,在对比数组中元素和要查找的元素时,使用全等(===)进行比较,也就是两项必须严格相等。
 
断言函数搜索find() 和 findIndex()
如:
const people = [
{
name: "Matt",
age: 27
},
{
name: "Nicholas",
age: 29
}
];
alert(people.find((element, index, array) => element.age < 28));
// {name: "Matt", age: 27}
alert(people.findIndex((element, index, array) => element.age < 28));
 
在找到匹配项后,这两个方法都不会继续搜索。
 
5.迭代方法

5个迭代方法:

every():对数组每一项都运行传入的函数,如果对每一项函数都返回 true,则这个方法返回 true。
filter():对数组每一项都运行传入的函数,函数返回 true 的项会组成数组之后返回。
forEach():对数组每一项都运行传入的函数,没有返回值。
map():对数组每一项都运行传入的函数,返回由每次函数调用的结果构成的数组。
some():对数组每一项都运行传入的函数,如果有一项函数返回 true,则这个方法返回 true。
这些方法都不改变调用它们的数组。
 
//every()
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let everyResult = numbers.every((item, index, array) => item > 2);
alert(everyResult); // false
let someResult = numbers.some((item, index, array) => item > 2);
alert(someResult); // true
 
//filter()
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let filterResult = numbers.filter((item, index, array) => item > 2);
alert(filterResult); // 3,4,5,4,3
 
//map()
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
let mapResult = numbers.map((item, index, array) => item * 2);
alert(mapResult); // 2,4,6,8,10,8,6,4,2
 
//foreach()
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.forEach((item, index, array) => {
// 执行某些操作
});
 
//some() 和every() 相同,只不过some()返回 true 是因为至少有一项满足条件。every()返回 false 是因为并不是每一项都能达到要求。
 
6.归并方法
reduce()和 reduceRight()这两个方法都会迭代数组的所有项,并在此基础上构建一个最终返回值。
reduce()方法从数组第一项开始遍历到最后一项。
reduceRight()从最后一项开始遍历至第一项。
 
let values = [1, 2, 3, 4, 5];
let sum = values.reduce((prev, cur, index, array) => prev + cur);
alert(sum); // 15
第一次执行归并函数时,prev 是 1,cur 是 2。第二次执行时,prev 是 3(1 + 2),cur 是 3(数
组第三项)。如此递进,直到把所有项都遍历一次,最后返回归并结果。
 
posted @ 2021-04-21 00:42  望不忘初心  阅读(451)  评论(0编辑  收藏  举报