JS中数组的相关方法介绍

简介: JS中数组的相关方法介绍
  1. push()
  • 将一个或多个元素添加到数组的末尾,并返回新的长度。
let arr = [1, 2, 3];  
arr.push(4);  // arr 现在是 [1, 2, 3, 4]
  • pop()
  • 删除并返回数组的最后一个元素
let arr = [1, 2, 3, 4];  
let last = arr.pop();  // last 现在是 4,arr 现在是 [1, 2, 3]
  • shift()
  • 删除并返回数组的第一个元素。
let arr = [1, 2, 3, 4];  
let first = arr.shift();  // first 现在是 1,arr 现在是 [2, 3, 4]
  • unshift()
  • 将一个或多个元素添加到数组的开头,并返回新的长度
let arr = [2, 3, 4];  
arr.unshift(1);  // arr 现在是 [1, 2, 3, 4]

slice()

  • 提取数组的一部分并在新的数组中返回。提取的范围由开始和结束索引确定。不包含结束索引

 

let arr = [0, 1, 2, 3, 4];  
let sliced = arr.slice(1, 3);  // sliced 现在是 [1, 2]

 

splice()

  • 通过删除或替换现有元素或者添加新元素来修改数组,然后返回被修改的元素
let arr = [0, 1, 2, 3];  
arr.splice(1, 2, 'a', 'b');  // arr现在是 [0, 'a', 'b', 3]

 

  1. sort()
  • 对数组元素进行排序。默认排序是字母顺序或数字顺序。按照字母顺序排列字符串时,会先转换为 Unicode 码点。如果提供了比较函数,则按照该函数的结果进行排序。比较函数应该接收两个参数,如果第一个参数应该位于第二个参数之前,则返回负数;如果两个参数相等,则返回零;如果第一个参数应该位于第二个参数之后,则返回正数。
let arr = [3, 1, 4];  
arr.sort();  // arr现在是 [1, 3, 4]

reverse()

  • 将数组的元素颠倒顺序。请注意,原始数组会被修改
let arr = [0, 1, 2];  
arr.reverse();  // arr现在是 [2, 1, 0]
  • concat()
  • 将两个或更多数组连接在一起,并返回结果。不会更改现有数组,而是返回新数组。这是连接两个或更多数组的一种简便方法。它不会修改现有的数组,而是返回一个新数组。如果参数中的某些不是数组,它们会被转换为数组。如果任何参数为null或undefined,则它们将被视为空数组。任何非数组参数都不会改变原数组。这也是一种连接两个或更多数组合并成一个新数组的简便方法。例如:let new_array = old_array.concat(value1[, value2[, ...[, valueN]]]);。它将把所有可迭代的参数合并到一起,并返回结果数组。所以如果要合并两个字符串(字符串也可以使用该方法)也是可以的,代码如下:var str1 = 'Hello';var str2 = 'World'; 通过 str1.concat(str2); 后会得到结果字符串 'HelloWorld'。 注意,该方法并不会把合并的结果存储在新的变量里,而是改变了原来的旧变量。如需使用结果值,需要将结果赋值给新的变量:var result = str1.concat(str2); 这样 result 的值就是 'HelloWorld'

join()

  • 将数组中所有元素连接成一个字符串。需要传入一个参数作为连接符,如果不传则默认为逗号
let arr = ['a', 'b', 'c'];  
let str = arr.join();  // str现在是 "a,b,c"

 

  1. indexOf()
  • 返回指定元素在数组中的第一个索引,如果不存在则返回-1。
let arr = ['a', 'b', 'c'];  
let index = arr.indexOf('b');  // index现在是 1

 

  1. lastIndexOf()
  • 返回指定元素在数组中最后一个索引,如果不存在则返回-1。

 

let arr = ['a', 'b', 'c', 'b'];  
let index = arr.lastIndexOf('b');  // index现在是 3

 

forEach()

  • 对数组中的每个元素执行一次给定的函数
let arr = [1, 2, 3];  
arr.forEach(function(value, index) {  
  console.log(value);  // 依次输出 1, 2, 3  
});
  • map()
  • 创建一个新数组,其结果是该数组中的每个元素都调用一个提供的函数后的结果
let arr = [1, 2, 3];  
let newArr = arr.map(function(value) {  
  return value * 2;  // 返回新数组 [2, 4, 6]  
});

 

filter()

  • 创建一个新数组,包含通过所提供函数实现的测试的所有元素
let arr = [1, 2, 3, 4];  
let newArr = arr.filter(function(value) {  
  return value > 2;  // 返回新数组 [3, 4]  
});

 

reduce()

  • 对数组中的每个元素应用一个函数,将其减少为单个值
let arr = [1, 2, 3, 4];  
let sum = arr.reduce(function(a, b) {  
  return a + b;  // 返回 10  
}, 0);

 

  1. find()
  • 返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。
let arr = [1, 2, 3, 4];  
let value = arr.find(function(value) {  
  return value > 2;  // 返回 3  
});

 

findIndex()

  • 返回数组中满足提供的测试函数的第一个元素的索引。否则返回 -1
let arr = [1, 2, 3, 4];  
let index = arr.findIndex(function(value) {  
  return value > 2;  // 返回 2  
});

 

some()

  • 测试数组中是否至少有一个元素通过由提供的函数实现的测试
let arr = [1, 2, 3, 4];  
let result = arr.some(function(value) {  
  return value > 3;  // 返回 true  
});
  1. every()
  • 测试数组的所有元素是否都通过了由提供的函数实现的测试。
let arr = [1, 2, 3, 4];  
let allPositive = arr.every(function(value) {  
  return value > 0;  // 返回 true  
});
  1. includes()
  • 判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回 false。
let arr = [1, 2, 3, 4];  
let included = arr.includes(2);  // 返回 true
  • flat()flatten() (注意:flatten() 并不是标准的方法,但经常被误用或混淆;应使用 flat())
  • 创建一个新数组,所有子数组的元素都递归连接到一个新数组中。
let arr = [1, 2, [3, 4, [5, 6]]];  
let flattened = arr.flat(2);  // 返回 [1, 2, 3, 4, 5, 6]
  1. flatMap()
  • 先对每个元素执行一个映射函数,然后将结果展平到一个新数组中。
let arr = [1, 2, 3];  
let newArr = arr.flatMap(function(value) {  
  return [value, value * 2];  // 返回 [1, 2, 2, 4, 3, 6]  
});
  1. entries()
  • 返回一个新的数组迭代器对象,它包含数组中每个索引的键/值对。
let arr = ['a', 'b', 'c'];  
let iterator = arr.entries();  
for (let entry of iterator) {  
  console.log(entry);  // 输出 [0, 'a'], [1, 'b'], [2, 'c']  
}
  1. keys()
  • 返回一个新的数组迭代器对象,它包含数组中每个索引的键。
let arr = ['a', 'b', 'c'];  
let iterator = arr.keys();  
for (let key of iterator) {  
  console.log(key);  // 输出 0, 1, 2  
}
  1. values()
  • 返回一个新的数组迭代器对象,它包含数组的每个值。
let arr = ['a', 'b', 'c'];  
let iterator = arr.values();  
for (let value of iterator) {  
  console.log(value);  // 输出 'a', 'b', 'c'  
}
  1. copyWithin()
  • 在数组内部,将一系列元素复制到另一个位置,覆盖原有元素,但不会改变数组大小。
let arr = [1, 2, 3, 4, 5];  
arr.copyWithin(0, 3, 4);  // 返回 [4, 2, 3, 4, 5],从索引3复制元素到索引0
  1. fill()
  • 用一个固定值填充数组的一部分,从起始索引到结束索引。
let arr = [1, 2, 3, 4, 5];  
arr.fill(0, 1, 3);  // 返回 [1, 0, 0, 4, 5],从索引1到索引3(不包括)填充0
相关文章
|
7月前
|
监控 负载均衡 JavaScript
有哪些有效的方法可以优化Node.js应用的性能?
有哪些有效的方法可以优化Node.js应用的性能?
376 69
|
6月前
|
JavaScript Linux 内存技术
Debian 11系统下Node.js版本更新方法详解
本指南详细介绍在Linux系统中安装和管理Node.js的步骤。首先检查现有环境,包括查看当前版本和清除旧版本;接着通过NodeSource仓库安装最新版Node.js并验证安装结果。推荐使用nvm(Node Version Manager)进行多版本管理,便于切换和设置默认版本。同时,提供常见问题解决方法,如权限错误处理和全局模块迁移方案,以及版本回滚操作,确保用户能够灵活应对不同需求。
534 0
|
6月前
|
JavaScript Linux 内存技术
Debian 11系统下Node.js版本更新方法
Debian 11更新Node.js主要就是这三种方式,无论你是初涉其中的新手还是找寻挑战的专家,总有一种方式能满足你的需求。现在,你已经是这个
648 80
|
JavaScript 前端开发 程序员
前端原生Js批量修改页面元素属性的2个方法
原生 Js 的 getElementsByClassName 和 querySelectorAll 都能获取批量的页面元素,但是它们之间有些细微的差别,稍不注意,就很容易弄错!
284 1
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
10月前
|
前端开发 JavaScript
有没有方法可以保证在JavaScript中多个异步操作的执行顺序?
有没有方法可以保证在JavaScript中多个异步操作的执行顺序?
429 58
|
监控 JavaScript Java
Node.js中内存泄漏的检测方法
检测内存泄漏需要综合运用多种方法,并结合实际的应用场景和代码特点进行分析。及时发现和解决内存泄漏问题,可以提高应用的稳定性和性能,避免潜在的风险和故障。同时,不断学习和掌握内存管理的知识,也是有效预防内存泄漏的重要途径。
935 159
|
8月前
|
JavaScript 前端开发 Java
js 垃圾回收机制的方法
JS回收机制方法讲解
|
9月前
|
JavaScript 前端开发 API
JavaScript中通过array.map()实现数据转换、创建派生数组、异步数据流处理、复杂API请求、DOM操作、搜索和过滤等,array.map()的使用详解(附实际应用代码)
array.map()可以用来数据转换、创建派生数组、应用函数、链式调用、异步数据流处理、复杂API请求梳理、提供DOM操作、用来搜索和过滤等,比for好用太多了,主要是写法简单,并且非常直观,并且能提升代码的可读性,也就提升了Long Term代码的可维护性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
|
9月前
|
JavaScript 前端开发 Java
深入理解 JavaScript 中的 Array.find() 方法:原理、性能优势与实用案例详解
Array.find() 是 JavaScript 数组方法中一个非常实用和强大的工具。它不仅提供了简洁的查找操作,还具有性能上的独特优势:返回的引用能够直接影响原数组的数据内容,使得数据更新更加高效。通过各种场景的展示,我们可以看到 Array.find() 在更新、条件查找和嵌套结构查找等场景中的广泛应用。 在实际开发中,掌握 Array.find() 的特性和使用技巧,可以让代码更加简洁高效,特别是在需要直接修改原数据内容的情形。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一