你真的知道Array的所有用法吗?Array总结

196 阅读7分钟

哈喽哈喽,这里是小菜不拖延博主,最近写题老是要处理数组,看题解又看到很多自己没看过的方法,那就干脆整理一下吧!(太偏僻的没写上去)

  1. concat(): 连接两个或更多数组,并返回结果数组。
  2. copyWithin(): 从数组内部复制一段元素到指定的起始位置。
  3. entries(): 返回一个包含数组键值对的迭代器对象。
  4. every(): 检测数组中的所有元素是否都满足指定条件。
  5. fill(): 用静态值填充数组的所有元素。
  6. filter(): 返回满足指定条件的所有元素组成的新数组。
  7. find(): 返回满足指定条件的第一个元素。
  8. findIndex(): 返回满足指定条件的第一个元素的索引。
  9. flat(): 将嵌套的数组扁平化为一个新数组。
  10. flatMap(): 对数组每个元素执行指定操作,并将结果扁平化为一个新数组。
  11. forEach(): 对数组的每个元素执行指定操作。
  12. from(): 通过类数组对象或可迭代对象创建一个新数组。
  13. includes(): 判断数组是否包含指定元素。
  14. indexOf(): 返回指定元素在数组中首次出现的索引。
  15. isArray(): 判断给定值是否为数组。
  16. join(): 将数组的所有元素转换成字符串并连接起来。
  17. keys(): 返回一个包含数组索引的迭代器对象。
  18. lastIndexOf(): 返回指定元素在数组中最后一次出现的索引。
  19. map(): 对数组的每个元素执行指定操作,并返回一个新数组。
  20. pop(): 删除数组中的最后一个元素,并返回该元素的值。
  21. push(): 向数组的末尾添加一个或多个元素,并返回新的长度。
  22. reduce(): 从左到右对数组的每个元素执行累积操作,返回一个值。
  23. reduceRight(): 从右到左对数组的每个元素执行累积操作,返回一个值。
  24. reverse(): 颠倒数组中元素的顺序。
  25. shift(): 删除数组的第一个元素,并返回该元素的值。
  26. slice(): 从指定索引开始提取数组中的一段元素,可以用于字符串,不改变原数组,并返回一个新数组。
  27. some(): 检测数组中是否至少有一个元素满足指定条件。
  28. sort(): 对数组的元素进行排序。
  29. splice(): 在指定位置插入、删除或替换数组的元素,只能用于数组改变原数组,返回删除数组。
  30. toLocaleString(): 将数组的所有元素转换成字符串,并返回结果。
  31. toString(): 将数组的所有元素转换成字符串,并返回结果。
  32. unshift(): 向数组的开头添加一个或多个元素,并返回新的长度。
  33. values(): 返回一个包含数组值的迭代器对象。

增加

  • arr.push:数组末尾添加
  • arr.unshif: 数组开头添加
  • arr.fill: 将数组中的所有元素替换为静态值,会修改原数组,返回修改后的数组
// 将索引 1 到索引 3(不包括索引 3)之间的元素替换为 9 
// [0, 0, 0, 0, 0]
array.fill(9, 1, 3);
console.log(array); 
// [0, 9, 9, 0, 0]

参数说明:

-   `value`: 替换数组元素的值。
-   `start`(可选): 替换开始的索引,默认为 0。
-   `end`(可选): 替换结束的索引(不包含该索引),默认为数组长度。

删除

  • arr.pop: 删除数组最后一个元素,并返回

修改

  • concat:合并多个数组,不改变原数组,返回新数组
//合并数组
newarr=arr1.concat(arr2)

//参数可以是一个值
// 输出 [1, 2, 3, 4, 5, 6, 7]
newarr=arr.concat(4, 5, [6, 7]);
  • arr.join(可以指定分隔符): 将数组中的元素转化为字符串
  • arr.toString:将数组中的元素转化为字符串

  • arr.reverse: 反转数组

  • arr.sort:数组排序,注意!需要指定排序方式,会修改原数组

//可指定函数排序
var arr = [3, 1, 5, 2, 4]; 
arr.sort(function(a, b) { 
    return a - b; 
}); 
console.log(arr); // [1, 2, 3, 4, 5]

//`return a - b;`,它会将a和b进行比较,
//如果a小于b,则返回一个负数(例如-1),
//这将导致sort()方法将a排在b前面,
//否则返回一个正数(例如1),sort()方法将b排在a前面。
//如果a等于b,则返回0,两个元素的相对位置不会改变
  • splice: 起始索引、要删除或替换的元素个数(可选)、要添加到数组的新元素(可选,会改变原数组,只能用于数组
//删除,注意包含指定位置
//输出 [1, 2, 4, 5]
const array = [1, 2, 3, 4, 5];
array.splice(2, 1); 

//删除并且添加元素
//,可以添加不止一个元素,输出 [1, 2, "Hello", 4, 5]
const array = [1, 2, 3, 4, 5]; 
array.splice(2, 1, "Hello"); 

查找

  • indexOf: 返回指定元素在数组中的第一个匹配位置的索引,如果不存在则返回-1。

  • lastIndexOf: 返回指定元素在数组中最后一个匹配的位置的索引,如果不存在则返回-1。

  • slice: 根据索引,指定左闭右开的新数组,不改变原数组,返回新数组
arr.slice(2,3)

//省略结束索引,从index=2开始取
arr.slice(2)

//负数索引,倒数计数
//输出[3, 4],注意左闭右开这个点
arr = [1, 2, 3, 4, 5];
arr.slice(-3,-1)

//索引超过数组长度不会报错,而是返回一个空数组
  • filter:过滤出符合的元素,返回新数组
const  arr= numbers.filter(function(num) { 
    return num > 2; 
});

find:找到满足元素

  • es6新增的
  • 找到符合要求的元素之后立即停止
  • const foundElement = array.find(callback(element[, index[, array]])[, thisArg]);
  • callback: 用于测试每个元素的函数。接收三个参数:
  • element: 当前处理的元素。
  • index(可选): 当前处理元素的索引。
  • array(可选): 调用 find 的数组。
  • thisArg(可选): 在执行回调函数时使用的 this 值。
const numbers = [10, 20, 30, 40, 50];

// 查找第一个大于 25 的元素
const result = numbers.find(function(element) {
  return element > 25;
});
console.log(result); // 输出: 30
// 使用 thisArg 查找数组中第一个偶数,并返回该偶数的索引
const numbers = [1, 3, 5, 8, 9, 10];

function findFirstEven(element, index, array) {
    // this 将指向传入的对象(在这里是 evenFinder)
    if (element % 2 === 0) {
        this.foundIndex = index;
        return true; // 返回 true 以终止查找
    }
    return false;
}

const evenFinder = {
    foundIndex: -1
};

numbers.find(findFirstEven, evenFinder);

console.log(evenFinder.foundIndex); // 输出: 3,因为 8 是数组中第一个偶数的元素,索引为 3
  • map: 遍历数组 注意区别Map对象和数组的map
const result = array.map((element) => { 
    return element * 2; 
});
  • forEach:遍历数组执行指定函数,不改变原数组
numbers.forEach(function(num) { 
    console.log(num); 
});
  • reduce:从左到右对数组中的元素进行累积操作,返回一个值
  • reduceRight:从左到右对数组中的元素进行累积操作,返回一个值
const sum = numbers.reduce(function(total, num) {
    return total + num; 
}, 0);
  • every:检查数组中的所有元素是否满足指定的条件,如果某个元素不满足指定条件,every() 方法会立即停止遍历并返回 false
  • some:检查数组中是否至少有一个元素满足特定条件,返回值是一个布尔。方法会在遇到满足条件的元素后立即停止遍历,并返回 true。如果遍历完整个数组都没有找到满足条件的元素,则返回 false
//两个函数的用法是相同的
const result = array.some((element, index, array) => { 
    return element + index === array.length; 
});  // 输出 true

参数说明:

1.  `element`(必需):当前正在处理的元素。
1.  `index`(可选):当前元素在数组中的索引。
1.  `array`(可选):原始数组。
  • arr.includes(某个值,某个值··):存在就返回true,使用的是“严格相等”比较(===),即要求元素的值和类型都与参数匹配才会返回 true

flat: 扁平化数组,可以指定扁平化几层,创建新数组,不影响原数组

// 参数为 2,展开两层: [1, 2, 3, [4]] 
console.log(array.flat(2)); 

// 参数为 Infinity,展开所有层: [1, 2, 3, 4]
console.log(array.flat(Infinity)); 
  • values: 获取数组的迭代器对象,该对象可以通过遍历获取数组的值
const array = [1, 2, 3, 4, 5]; 
//创建迭代器对象
const iterator = array.values(); 
console.log(iterator.next().value); // 输出 1 
console.log(iterator.next().value); // 输出 2 
console.log(iterator.next().value); // 输出 3 
console.log(iterator.next().value); // 输出 4 
console.log(iterator.next().value); // 输出 5

//`values()` 方法返回的是一个可迭代对象,可以用于 `for...of` 循环。
for (const value of array.values()) { 
    console.log(value); 
}