Array静态方法
Array 构造函数本身也有一些方法,这些方法通常被称为静态方法。静态方法是直接在构造函数对象上定义的,而不是在其 prototype 属性上定义的,因此它们不是由数组实例继承的,而是直接通过 Array 对象来调用。
1.Array.isArray()
用于确定传递的值是否是一个数组。
console.log(Array.isArray([1, 2, 3])); // 输出:true
console.log(Array.isArray({foo: 123})); // 输出:false
2.Array.from()
从类数组对象或可迭代对象创建一个新的数组实例。
console.log(Array.from('foo')); // 输出:['f', 'o', 'o']
3.Array.of()
创建一个具有可变数量参数的新数组实例,而不考虑参数的数量或类型。
console.log(Array.of(1, 2, 3)); // 输出:[1, 2, 3]
Array.prototype上的方法
Array.prototype 上的方法是所有数组实例都可以使用的内置方法。这些方法用于操作数组,包括遍历、转换、搜索、排序和其他操作。以下是一些常用的 Array.prototype 方法及其使用示例:
1.push()
push() - 向数组的末尾添加一个或多个元素,并返回新的长度。
const fruits = ['apple', 'banana'];
fruits.push('orange'); // fruits: ['apple', 'banana', 'orange']
2.pop()
pop() - 移除数组的最后一个元素,并返回该元素。
const fruits = ['apple', 'banana', 'orange'];
const last = fruits.pop(); // last: 'orange', fruits: ['apple', 'banana']
3.shift()
shift() - 移除数组的第一个元素,并返回该元素。
const fruits = ['apple', 'banana', 'orange'];
const first = fruits.shift(); // first: 'apple', fruits: ['banana', 'orange']
4.unshift()
unshift() - 向数组的开头添加一个或多个元素,并返回新的长度。
const fruits = ['banana', 'orange'];
fruits.unshift('apple'); // fruits: ['apple', 'banana', 'orange']
5.forEach()
forEach() - 对数组的每个元素执行一次提供的函数。
const fruits = ['apple', 'banana', 'orange'];
fruits.forEach(fruit => console.log(fruit));
6.map()
map() - 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的返回值。
const numbers = [1, 2, 3];
const doubled = numbers.map(num => num * 2); // doubled: [2, 4, 6]
7.filter()
filter() - 创建一个新数组,包含通过所提供函数实现的测试的所有元素。
const numbers = [1, 2, 3, 4, 5];
const evens = numbers.filter(num => num % 2 === 0); // evens: [2, 4]
8.reduce()
reduce() - 对数组中的每个元素执行一个由您提供的“reducer”函数(升序执行),将其结果汇总为单个返回值。
const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // sum: 10
9.find()
find() - 返回数组中满足提供的测试函数的第一个元素的值,否则返回 undefined。
const numbers = [1, 2, 3, 4];
const found = numbers.find(num => num > 2); // found: 3
10.sort()
sort() - 对数组的元素进行排序,并返回数组。默认排序顺序是根据字符串Unicode码点。
const months = ['March', 'Jan', 'Feb', 'Dec'];
months.sort(); // months: ['Dec', 'Feb', 'Jan', 'March']
11.slice()
slice() - 返回一个新的数组对象,这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。不修改原数组
参数:start 规定从何处开始选取。如果该参数为负数,则表示从原数组的倒数第几个元素开始提取,slice(-2) 表示提取原数组中 的倒数第二个元素到最后一个元素(包含最后一个元素)。
end() 规定从何处结束选取。没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取
const fruits = ['apple', 'banana', 'orange', 'lemon'];
const citrus = fruits.slice(2, 4); // citrus: ['orange', 'lemon']
12.splice()
splice() - 通过删除现有元素和/或添加新元素来更改一个数组的内容。
返回删除的元素数组,如果仅删除一个元素,则返回一个元素的数组。 如果未删除任何元素,则返回空数组。
参数:index 必须,规定从何处添加/删除元素。该参数是开始插入和删除的数组元素的下标,必须是数字
howmany 可选,规定应该删除多少元素。必须是数字,但可以是“0”,如果为规定此参数,则删除从index开始到原数组结 尾的所有元素。
item…itemX 可选,要添加到数组的新元素
const fruits = ['apple', 'banana', 'orange', 'lemon'];
fruits.splice(1, 0, 'mango'); // fruits: ['apple', 'mango', 'banana', 'orange', 'lemon']
13.concat()
concat() - 用于合并两个或多个数组,不会改变现有的数组,而是返回一个新数组。
const alpha = ['a', 'b', 'c'];
const numeric = [1, 2, 3];
const alphaNumeric = alpha.concat(numeric); // alphaNumeric: ['a', 'b', 'c', 1, 2, 3]
14.join()
join() - 将数组中的所有元素连接成一个字符串,并返回这个字符串。
const elements = ['Fire', 'Air', 'Water'];
const joined = elements.join(); // joined: "Fire,Air,Water"
const joined1 = elements.join(''); // joined: "FireAirWater"
15.reverse()
reverse() - 颠倒数组中元素的位置,改变原数组,返回对数组的引用。
const numbers = [1, 2, 3];
numbers.reverse(); // numbers: [3, 2, 1]
16.indexOf()
indexOf() - 返回在数组中可以找到一个给定元素的第一个索引,如果不存在,则返回-1。
const beasts = ['ant', 'bison', 'camel', 'duck', 'bison'];
beasts.indexOf('bison'); // 1
17.lastIndexOf()
lastIndexOf() - 返回指定元素在数组中的最后一个的索引,如果不存在则返回 -1。
const numbers = [2, 5, 9, 2];
numbers.lastIndexOf(2); // 3
18.includes()
includes() - 用来判断一个数组是否包含一个指定的值,如果是,则返回 true,否则返回 false。
const fruits = ['apple', 'banana', 'mango'];
fruits.includes('banana'); // true
19.every()
every() - 测试数组的所有元素是否都通过了指定函数的测试。
const isBelowThreshold = (currentValue) => currentValue < 40;
const array1 = [1, 30, 39, 29, 10, 13];
array1.every(isBelowThreshold); // true
20.some()
some() - 测试数组中是不是至少有1个元素通过了被提供的函数测试。
const array = [1, 2, 3, 4, 5];
const even = (element) => element % 2 === 0;
array.some(even); // true
21.findIndex()
findIndex() - 返回数组中满足提供的测试函数的第一个元素的索引,否则返回-1。
const array1 = [5, 12, 8, 130, 44];
const isLargeNumber = (element) => element > 13;
array1.findIndex(isLargeNumber); // 3
22.fill()
fill() - 用一个固定值来填充一个数组中从起始索引到终止索引内的全部元素,不包括终止索引。
value 必须,填充的值
start 可选,开始填充的位置
end 可选,停止填充的位置,默认为array.length
const array1 = [1, 2, 3, 4];
array1.fill(0, 2, 4); // array1: [1, 2, 0, 0]
23.flat()
flat() - 会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。
const arr1 = [1, 2, [3, 4]];
arr1.flat(); // [1, 2, 3, 4]
24.flatMap()
flatMap() - 首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它相当于先执行 map() 方法,然后对 map() 方法的结果执行 flat() 方法。flatMap() 方法只能压平一层数组。如果你需要压平多层嵌套数组,你仍然需要使用 flat() 方法,并指定所需的深度。
let arr = [1, 2, 3, 4];
// 使用 map 和 flat 分别实现
let mapResult = arr.map(x => [x * 2]);
// mapResult 是 [[2], [4], [6], [8]]
let flatResult = mapResult.flat();
// flatResult 是 [2, 4, 6, 8]
// 使用 flatMap 实现相同的功能
let flatMapResult = arr.flatMap(x => [x * 2]);
// flatMapResult 是 [2, 4, 6, 8]
25.copyWithIn()
copyWithin() 方法是一个在数组内部进行浅复制到指定位置的方法,它在数组内部将一系列元素的序列复制到数组中的另一个位置,并返回它,而不修改数组的大小。
copyWithin() 方法的基本语法如下:
arr.copyWithin(target, start[, end])
target:复制序列到该位置的索引。如果是负值,target 将从数组末尾开始计算。
start:复制序列的起始位置的索引。如果是负值,start 将从数组末尾开始计算。
end(可选):复制序列结束位置的索引(但不包括 end 本身)。如果省略或大于数组长度,复制将一直到数组末尾。如果是负值,end 将从数组末尾开始计算。
let array = [1, 2, 3, 4, 5];
// 将从索引 3 开始的元素复制到索引 0 的位置
array.copyWithin(0, 3);
console.log(array); // 输出:[4, 5, 3, 4, 5]
// 将从索引 1 开始到索引 3(不包括索引 3)的元素复制到索引 3 的位置
array = [1, 2, 3, 4, 5];
array.copyWithin(3, 1, 3);
console.log(array); // 输出:[1, 2, 3, 2, 3]
26.keys()、values()、entries()
keys()是对键名的遍历、values()对键值的遍历、entries()是对键值对的遍历。
const array = ['a', 'b', 'c'];
const iterator = array.keys();
for (const key of iterator) {
console.log(key); // 输出:0 1 2
}
//
const array = ['a', 'b', 'c'];
const iterator = array.values();
for (const value of iterator) {
console.log(value); // 输出:'a' 'b' 'c'
}
//
const array = ['a', 'b', 'c'];
const iterator = array.entries();
for (const [index, value] of iterator) {
console.log(index, value); // 输出:0 'a' 1 'b' 2 'c'
}
会修改原始数组而不是返回一个新数组的方法:
push() - 向数组的末尾添加一个或多个元素,并返回新的长度。
pop() - 移除数组的最后一个元素,并返回该元素。
shift() - 移除数组的第一个元素,并返回该元素。
unshift() - 向数组的开头添加一个或多个元素,并返回新的长度。
reverse() - 颠倒数组中元素的位置。
sort() - 对数组的元素进行排序。
splice() - 通过删除、替换或添加新元素来更改数组。
fill() - 用一个固定值来填充一个数组中从起始索引到终止索引内的全部元素。
copyWithin() - 在数组内部将一系列元素的位置复制到另一个位置,并返回原数组(会覆盖原始位置的元素)。
const array1 = ['a', 'b', 'c', 'd', 'e'];
//将3到4 不包括4 复制到0的位置
array1.copyWithin(0, 3, 4); // array1 is now ['d', 'b', 'c', 'd', 'e']
数组去重方法
1.使用 Set 和 Spread Operator
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [...new Set(array)];
console.log(uniqueArray); // [1, 2, 3, 4, 5]
2.使用 Set 和 Array.from()
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = Array.from(new Set(array));
console.log(uniqueArray); // [1, 2, 3, 4, 5]
3.使用 filter 和 indexOf
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.filter((item, index) => array.indexOf(item) === index);
console.log(uniqueArray); // [1, 2, 3, 4, 5]
4.使用 reduce 和 includes
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.reduce((acc, item) => {
return acc.includes(item) ? acc : [...acc, item];
}, []);
console.log(uniqueArray); // [1, 2, 3, 4, 5]
5.使用 Map 对象
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = Array.from(new Map(array.map((item) => [item, item])).values());
console.log(uniqueArray); // [1, 2, 3, 4, 5]
//map() 方法遍历原始数组 array。对于数组中的每个元素 item,map() 方法都会创建一个包含两次该元素的新数组(形成一个键值对 [item, item]),并返回一个新的数组,其中包含了这些键值对。
//new Map(array.map((item) => [item, item])):这里使用 Map 构造函数创建一个新的 Map 对象。Map 对象是键值对的集合,其中的键是唯一的。由于 map() 方法返回的数组包含键值对,这些键值对被用作初始化 Map 对象。如果有重复的 item,Map 对象会自动保留最后一个键值对,因为键在 Map 中是唯一的。
//Map.prototype.values() 方法返回一个新的迭代器对象,它包含 Map 对象中每个元素的值。由于 Map 对象是由数组中的元素作为键和值创建的,所以这些值实际上是数组中的唯一元素。
//Array.from() 方法然后将这个迭代器对象转换成一个新的数组。结果是一个包含原始数组中所有唯一值的数组。
6.使用对象属性的唯一性
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueObj = {};
const uniqueArray = array.filter(item => uniqueObj.hasOwnProperty(item) ? false : (uniqueObj[item] = true));
console.log(uniqueArray); // [1, 2, 3, 4, 5]
7.使用 forEach 和 includes
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = [];
array.forEach(item => {
if (!uniqueArray.includes(item)) {
uniqueArray.push(item);
}
});
console.log(uniqueArray); // [1, 2, 3, 4, 5]
8.使用 sort 方法
const array = [1, 2, 2, 3, 4, 4, 5];
const uniqueArray = array.sort().filter((item, index, arr) => !index || item != arr[index - 1]);
console.log(uniqueArray); // [1, 2, 3, 4, 5]
9.将数组的每一个元素依次与其他元素做比较
var arr = [1,9,8,8,7,2,5,3,3,3,2,3,1,4,5,444,55,22];
console.log(arr);
function noRepeat(arr) {
for(var i = 0; i < arr.length-1; i++){
for(var j = i+1; j < arr.length; j++){
if(arr[i]===arr[j]){
arr.splice(j,1);
j--;
}
}
}
return arr;
}
var arr2 = noRepeat(arr);
console.log(arr2);