Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $YECBGYFECGEAFWHA as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2

Deprecated: imwpcache\f884414bce24ee67f\f73723ec7b1919fa5::__construct(): Implicitly marking parameter $BBWFDDBHHYHDXXAB as nullable is deprecated, the explicit nullable type must be used instead in /www/wwwroot/www.chuangxiangniao.com/wp-content/plugins/imwpcache-dist/build/f884414bce24ee67ff73723ec7b1919fa5.php on line 2
每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)_创想鸟

每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)

每个开发人员都应该掌握的 javascript 数组方法(第 1 部分)

“能力越大,责任越大。”
— 本叔叔,蜘蛛侠 (2002)

就像蜘蛛侠必须掌握他新发现的能力一样,开发人员需要掌握 javascript 强大的数组方法才能高效、负责任地进行编码。

让我们深入研究一些必须知道的数组方法!

1. 查找

find() 方法返回满足所提供的测试函数的第一个数组元素的值。

arr.find(callback(element, index, arr),thisarg)

立即学习“Java免费学习笔记(深入)”;

返回数组中满足给定函数的第一个元素的值。如果没有元素满足该函数,则返回未定义

const cuties = [  { name: "wanda maximoff", age: 31 },  { name: "natasha romanoff", age: 32 },  { name: "jane foster", age: 27 },  { name: "gwen stacy", age: 26 },];// find method returns the value of the first element // in the array that satisfies the given function // or else returns undefinedlet cuty = cuties.find(({ age }) => age >= 30);// output: { name: 'wanda maximoff', age: 31 }console.log(cuty);

2. 查找索引

findindex() 方法返回满足所提供的测试函数的第一个数组元素的索引,否则返回 -1。

arr.findindex(callback(element, index, arr),thisarg)

返回数组中满足给定函数的第一个元素的索引。如果没有元素满足该函数,则返回-1。

const cuties = [  { name: "wanda maximoff", age: 31 },  { name: "natasha romanoff", age: 32 },  { name: "jane foster", age: 27 },  { name: "gwen stacy", age: 26 },];// findindex method returns the index of the first array element // that satisfies the provided test function or else returns -1.let cutyindex = cuties.findindex(({ age }) => age >= 30);// output: 0console.log(cutyindex);

3.索引

indexof() 方法返回数组元素出现的第一个索引,如果未找到,则返回 -1。

arr.indexof(searchelement, fromindex)

如果元素在数组中至少出现一次,则返回该元素的第一个索引。如果在数组中未找到该元素,则返回-1。

const productprices = [5, 12, 3, 20, 5, 2, 50];// indexof() returns the first index of occurance // of an array element, or -1 if it is not found.let firstindex = productprices.indexof(20);console.log(firstindex); // 3let secondindex = productprices.indexof(5);console.log(secondindex); // 0// the second argument specifies the search start indexlet thirdindex = productprices.indexof(5, 1);console.log(thirdindex); // 4// indexof returns -1 if not foundlet notfoundindex = productprices.indexof(15);console.log(notfoundindex); // -1

4. 排序

sort() 方法按特定顺序(升序或降序)对数组的项目进行排序。

arr.sort(comparefunction)

对数组元素进行排序后返回数组(这意味着它更改了原始数组并且不进行复制)。

const avengers = ["captain", "tony", "thor",                   "natasha", "bruce", "clint"];// modifies the array in placeavengers.sort(); // [ 'bruce', 'captain', 'clint', 'natasha', 'thor', 'tony' ]console.log(avengers);  const nums = [1000, 50, 2, 7, 14];// number is converted to string and sortednums.sort(); // output: [ 1000, 14, 2, 50, 7 ]console.log(nums) // sort nums in ascending order by providing compare functionnums.sort((a, b) => a - b);// output: [ 2, 7, 14, 50, 1000 ]console.log(nums);

5. 包括

includes() 方法检查数组是否包含指定元素。

arr.includes(valuetofind, fromindex)

includes() 方法返回:

如果在数组 searchvalue 中的任何位置找到,则为 true如果在数组 searchvalue 中找不到任何位置,则返回 false

const avengers = ["captain", "tony", "thor",                  "natasha", "bruce", "clint"];// includes() method returns true if an array contains // a specified element or else returns false.let check1 = avengers.includes("thor");console.log(check1); // true // second argument specifies position to start the searchlet check2 = avengers.includes("thor", 3);console.log(check2); // false// the search starts from the 4th-to-last element ("hulk") // and checks the rest of the array for "thor". let check3 = avengers.includes("thor", -4);console.log(check3); // true

6. foreach

foreach() 方法为每个数组元素执行提供的函数。

arr.foreach(callback(currentvalue), thisarg)

• foreach() 不会对没有值的数组元素执行回调。

• 返回未定义。

const nums = [120, 150, 80, , 200];// foreach() method executes a provided // function for each array element which // have values. it returns undefined./*num 0: 120num 1: 150num 2: 80num 4: 200*/nums.foreach((value, index) => {    console.log('num ' + index + ': ' + value);});

7. 切片

slice() 方法将数组的一部分的浅拷贝返回到新的数组对象中。

arr.slice(开始, 结束)

• 返回包含提取元素的新数组。

const fruits = ["apple", "banana", "orange", "grape", "mango"];// slicing the array (from start to end)let slicedfruits1 = fruits.slice();console.log(slicedfruits1); // [ 'apple', 'banana', 'orange', 'grape', 'mango' ]// slicing from the third elementlet slicedfruits2 = fruits.slice(2);console.log(slicedfruits2); // [ 'orange', 'grape', 'mango' ]// slicing from the second element to fourth elementlet slicedfruits3 = fruits.slice(1, 4);console.log(slicedfruits3); // [ 'banana', 'orange', 'grape' ]// slicing the array from start to second-to-lastlet slicedfruits4 = fruits.slice(0, -1);console.log(slicedfruits4); // [ 'apple', 'banana', 'orange', 'grape' ]// slicing the array from third-to-lastlet slicedfruits5 = fruits.slice(-3);console.log(slicedfruits5); // [ 'orange', 'grape', 'mango' ]

8. 拼接

splice() 方法修改数组(添加、删除或替换元素)。

arr.splice(start, deletecount, item1, …, itemn)

• 返回包含已删除元素的数组。

let animals = ["dog", "cat", "elephant", "lion"];// replacing "elephant" & "lion" with "tiger" & "giraffe"let removedanimals1 = animals.splice(2, 2, "tiger", "giraffe");console.log(removedanimals1); // [ 'elephant', 'lion' ]console.log(animals); // [ 'dog', 'cat', 'tiger', 'giraffe' ]// adding elements without deleting existing elementslet removedanimals2 = animals.splice(1, 0, "elephant", "lion");console.log(removedanimals2); // []console.log(animals); // [ 'dog', 'elephant', 'lion', 'cat', 'tiger', 'giraffe' ]// removing 3 elementslet removedanimals3 = animals.splice(2, 3);console.log(removedanimals3); // [ 'lion', 'cat', 'tiger' ]console.log(animals); // [ 'dog', 'elephant', 'giraffe' ]

9. 每个

every() 方法检查所有数组元素是否通过给定的测试函数。

arr.every(callback(currentvalue), thisarg)

every() 方法返回:

true – 如果所有数组元素都通过给定的测试函数(回调返回真值)。false – 如果任何数组元素未通过给定的测试函数。

const nums1 = [ 1 , 2 , 3 , 4 , 5];// every() method returns true if all the array // elements pass the given test function or else// returns falselet result1 = nums1.every(element => element  element < 6);// output: falseconsole.log(result2);

10.一些

some() 方法测试是否有任何数组元素通过给定的测试函数。

arr.some(callback(currentvalue), thisarg)

如果数组元素通过给定的测试函数,则返回 true(回调返回真值)。否则返回 false

const nums1 = [ 8 , 2 , 7 , 9 , 6];// some() method returns true if any of the array // elements pass the given test function or else // returns falselet result1 = nums1.some(element => element  element < 6);// Output: falseconsole.log(result2);

请继续关注我们系列的第 2 部分,我们将深入探讨更重要的 javascript 数组方法!快乐学习!

以上就是每个开发人员都应该掌握的 JavaScript 数组方法(第 1 部分)的详细内容,更多请关注创想鸟其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1491229.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
代码日
上一篇 2025年12月19日 13:47:10
免费接龙
下一篇 2025年12月19日 13:47:23

相关推荐

  • 《GT赛车7》将于12月推出大型免费更新“SPEC III”

    sie宣布,《gt赛车》系列的全球总销量已正式突破1亿大关。作为庆祝,即将于12月推出的《gt赛车7》大型免费更新“spec iii”将带来全新赛道与多款新赛车等丰富内容。 视频:https://www.php.cn/link/44917919527fa652749f1acb6dcf9617 以上就…

    2026年9月21日
    100
  • Java OOP如何使用内部类提高代码组织性

    内部类提升Java代码组织性与封装性,成员内部类增强封装,静态内部类分离逻辑,局部与匿名内部类简化回调,私有内部类隐藏实现细节。 内部类在Java面向对象编程中是一种有效提升代码组织性和封装性的工具。通过将一个类定义在另一个类的内部,可以更好地表达类之间的逻辑关系,控制访问权限,并减少命名冲突。合理…

    2026年9月21日
    000
  • MySQL缓存机制对性能提升的作用_MySQL缓存配置及调优方案

    MySQL缓存机制对性能提升的作用_MySQL缓存配置及调优方案MySQL缓存机制对性能提升的作用_MySQL缓存配置及调优方案MySQL缓存机制对性能提升的作用_MySQL缓存配置及调优方案MySQL缓存机制对性能提升的作用_MySQL缓存配置及调优方案

    mysql的缓存机制主要包括innodb缓冲池、查询缓存和操作系统文件系统缓存等,其中innodb缓冲池是性能优化的核心。1. innodb缓冲池缓存表数据和索引页,减少磁盘i/o,提升读写效率;2. 查询缓存因失效频繁及锁竞争问题,在高并发场景下易成瓶颈,已在mysql 8.0中移除;3. 操作系…

    2026年9月21日 • 用户投稿
    100
  • VSCode中竖线怎么设置_VSCode编辑区竖线(标尺)显示与配置教程

    在VSCode中启用垂直标尺需修改settings.json文件中的editor.rulers属性,如设置{ “editor.rulers”: [80, 120] }可在第80和120列显示竖线,提升代码对齐与可读性;虽原生不支持自定义颜色样式,但可通过安装Guides或In…

    2026年9月21日
    100
  • PHP 数组值比较与嵌套数组过滤教程

    本教程详细讲解如何在 PHP 中比较一个简单数组与一个复杂嵌套数组,并根据特定条件(如文件名匹配)过滤嵌套数组中的所有相关子数组。我们将通过识别非匹配项的索引,然后从所有子数组中移除这些项并重新索引,实现精确的数据筛选。 问题背景 在 php 开发中,我们经常会遇到需要处理结构复杂的数组数据。例如,…

    2026年9月21日
    100
  • 漫番漫画官方网页_ 漫番漫画在线访问入口

    漫番漫画官方网页入口为https://manwa.me,该平台汇聚多类型漫画资源,界面简洁、更新稳定,支持网页端流畅阅读;采用动态域名与镜像站点保障访问连续性,配备HTTPS加密提升安全性;提供个性化阅读设置、书架收藏及评论互动功能,优化用户体验。 漫番漫画官方网页入口地址在哪里?这是不少网友都关注…

    2026年9月21日
    200
  • Laravel中的事件和监听器:解耦和优化应用程序交互

    Laravel中的事件和监听器:解耦和优化应用程序交互 引言:在开发应用程序时,我们经常会面临需要实现模块之间的通信和协作的情况。传统的方法是直接在代码中调用其他模块的方法或者通过回调函数进行通信。然而,这种紧密耦合的设计方式会导致代码的复杂性和维护性的下降。为了解决这个问题,Laravel框架提供…

    2026年9月21日
    000
  • 抖音托管商品要钱吗?新人适合橱窗托管吗

    随着抖音平台影响力的不断扩大,越来越多的商家将其视为拓展线上业务的重要渠道。其中,抖音托管商品作为一种新兴推广方式,逐渐受到商家关注。然而,关于“抖音托管商品是否收费”这一问题,仍存在诸多疑问。本文将围绕这一话题展开分析,帮助商家更好地了解相关机制。 一、抖音托管商品概述 抖音托管商品是指商家将商品…

    2026年9月21日
    000
  • Linux之包管理工具(RPM和YUM)

    包管理工具1. rpm包1.1 rpm指令1.1.1 查询指令使用rpm查询已安装的rpm列表:rpm -qa | grep xx 检查是否已安装firefox:rpm -qa | grep firefox 如果显示i686或i386,表示32位系统,noarch表示通用rpm -qa:列出所有已安…

    2026年9月21日
    000
  • windows11磁盘分区怎么操作_windows11磁盘分区调整方法

    可通过系统磁盘管理或易我分区大师调整Windows 11分区。先使用磁盘管理压缩卷释放未分配空间,再新建简单卷;或用易我分区大师无损调整分区,拖动滑块释放空间后合并至目标分区,最后执行任务完成操作。 如果您希望对Windows 11的硬盘进行重新规划,但不确定如何安全地拆分或合并存储空间,则可能是由…

    2026年9月21日
    100
  • Java集合框架在数据处理中的应用实例

    使用Set去重:通过LinkedHashSet去除标签重复并保持顺序;2. Map统计频次:利用HashMap统计单词出现次数;3. List结合Comparator排序:按年龄升序、姓名降序排列用户;4. 集合嵌套处理数据:用Map组织部门与员工列表。集合框架提升数据处理效率与代码可读性。 Jav…

    2026年9月21日
    000
  • Chrome浏览器怎么开启数据同步功能_Chrome浏览器跨设备数据同步设置教程

    首先登录Google账户启用Chrome同步功能,确保书签、历史记录、密码等数据跨设备一致;接着在设置中自定义同步内容类型以满足隐私需求;然后通过Google账户密钥或自定义密码加密同步数据,提升安全性;最后在新设备登录同一账户,自动接收已同步的浏览数据,实现无缝体验。 如果您希望在不同设备间无缝使…

    2026年9月21日
    000
  • 如何为iPhone12Pro刷机固件下载?一步步教你操作

    首先使用爱思助手一键下载适用于iPhone 12 Pro的iOS 18固件,若失败则手动导入IPSW文件,最后可通过恢复模式配合电脑工具强制刷机完成系统重装。 如果您尝试为您的设备重新安装操作系统,但无法获取正确的系统文件,则可能是由于固件下载路径不正确或工具不支持。以下是解决此问题的步骤: 本文运…

    2026年9月21日
    000
  • 如何使用XGBoost训练AI大模型?优化机器学习模型的步骤

    XGBoost并非用于训练GPT类大模型,而是擅长处理结构化数据的高效梯度提升算法,其优势在于速度快、准确性高、支持并行计算、内置正则化与缺失值处理,适用于表格数据建模;通过分阶段超参数调优(如学习率、树深度、采样策略)、结合贝叶斯优化与交叉验证,并配合特征工程、数据预处理和集成学习等关键步骤,可显…

    2026年9月21日
    000
  • 《寂静岭f》明日正式发售!PS官方发文介绍游戏

    《寂静岭f》明日正式发售!PS官方发文介绍游戏《寂静岭f》明日正式发售!PS官方发文介绍游戏《寂静岭f》明日正式发售!PS官方发文介绍游戏《寂静岭f》明日正式发售!PS官方发文介绍游戏

    来入手《寂静岭f》吧!使用专属优惠券并叠加金币后,标准版仅需361.59元(共节省29.41元);豪华版为412.76元(总计优惠33.24元)。 备受期待的《寂静岭》系列新作《寂静岭f》将于明日(9月25日)正式上线。PS官方博客近日发布详细情报,揭开这款作品的神秘面纱。 本作背景设定在1960年…

    2026年9月21日 • 用户投稿
    000
  • VSCode代码编辑器在线使用_VSCode网页版免安装直接进入编辑

    答案:无需安装即可在浏览器使用VSCode,主要方式包括GitHub Codespaces、Gitpod、StackBlitz、CodeSandbox和自托管code-server,适用于不同场景,如GitHub集成、前端开发或完全控制环境;但存在网络依赖、性能限制、插件兼容性、文件访问和安全等局限…

    2026年9月21日
    100
  • MySQL全文搜索如何与外部引擎结合_提升搜索体验?

    MySQL全文搜索如何与外部引擎结合_提升搜索体验?MySQL全文搜索如何与外部引擎结合_提升搜索体验?MySQL全文搜索如何与外部引擎结合_提升搜索体验?MySQL全文搜索如何与外部引擎结合_提升搜索体验?

    mysql 的全文搜索在中文分词和复杂查询上存在局限,常结合外部引擎提升性能。1. 使用 elasticsearch,通过 logstash 或 canal 同步数据,安装中文分词插件并利用布尔查询等优化搜索。2. 利用 sphinx,从 mysql 直接构建索引,通过 sql-like 接口和中文…

    2026年9月21日 • 用户投稿
    000
  • VSCode远程开发:配置容器与SSH连接的最佳实践解析

    使用VSCode远程开发提升效率,通过Remote-Containers和Remote-SSH实现环境标准化。1. 配置.devcontainer文件夹,用devcontainer.json定义容器环境,推荐自定义Dockerfile并预装工具;2. SSH连接需配置公钥认证、~/.ssh/conf…

    2026年9月21日
    100
  • win8如何禁用笔记本自带键盘_Win8笔记本键盘禁用方法

    可通过命令提示符、设备管理器或注册表编辑器禁用Win8笔记本自带键盘。1、命令提示符输入sc config i8042prt start= disabled并重启;2、设备管理器中禁用“PS/2标准键盘”或“HID Keyboard Device”;3、注册表中将i8042prt服务的Start值改…

    2026年9月21日
    000
  • Ubuntu20.04安装详细图文教程(双系统)[通俗易懂]

    Ubuntu20.04安装详细图文教程(双系统)[通俗易懂]Ubuntu20.04安装详细图文教程(双系统)[通俗易懂]Ubuntu20.04安装详细图文教程(双系统)[通俗易懂]Ubuntu20.04安装详细图文教程(双系统)[通俗易懂]

    大家好,很高兴再次与你们见面,我是你们的朋友全栈君。 Ubuntu安装前言最近我决定将开发环境切换到Linux系统,经过一番研究,我选择了Ubuntu桌面版,因为它不仅美观,而且作为生产系统的生态环境也非常好。于是,我开始寻找安装Ubuntu双系统的方法。安装方法有三种: 虚拟机安装:这种方法无法充…

    2026年9月21日 • 用户投稿
    000

发表回复

登录后才能评论
关注微信