网易首页 > 网易号 > 正文 申请入驻

8 你应该知道的JavaScript 数组方法

0
分享至

原文 | https://javascript.plainenglish.io/8-javascript-array-methods-you-should-know-81947c9e46de

原译 | 杨小二

数组构成了几乎任何编程语言的组成部分。了解数组对于揭示编程概念非常重要。

根据维基百科的解释,数组可以定义为由一组元素组成的数据结构,每个元素由至少一个数组索引或键标识。存储一个数组,以便可以通过数学公式从其索引元组计算每个元素的位置。

在本文中,我们将研究 JavaScript 数组方法以及如何使用它们。

简单来说,数组只是一个变量,在给定时间可以保存多个值。

另外需要注意的是,几乎所有主流浏览器都支持这些数组方法。

1、map() 方法

map() 方法是一种数组方法,它通过对付数组中存在的每个元素调用函数来创建数组。

此方法不会为没有值的数组元素执行函数。

map() 数组方法的行为就像一个纯函数,不会改变原始数组。

例子:

const users = [{name:‘John’, age:33},
{name:‘Philip’, age:40},
{name:‘Carl’, age:30},
{name:‘Frank’, age:27},
{name:‘Florin’, age:25},
{name:‘Debby’, age:21},
{name:‘Liam’, age:26}]
const userAge=users.map((user)=>{return user.name})
console.log(userAge)

这将返回给定数组中的所有名称。

2、filter() 方法

filter() 数组方法返回一个给定的数组,该数组从原始数组传递给定的计算。在filter()内部,我们提供了如下所示的功能。

filter() 函数不能用于没有值的数组元素。

filter() 函数不会改变原始数组,因此它的行为就像一个纯函数。

例子:

const users = [
{name:‘John’, age:33},
{name:‘Philip’, age:40},
{name:‘Carl’, age:30},
{name:‘Frank’, age:27},
{name:‘Florin’, age:25},
{name:‘Debby’, age:21},
{name:‘Liam’, age:26}]
const filterUsers = users.filter((user)=>{return user.age <=27})
console.log(filterUsers)
3、find() 方法

find() 数组方法用于在数组中查找给定对象。

此方法返回通过给定语句测试的第一个元素的值。

此方法对数组中存在的每个元素执行一次给定的函数。

find() 方法不会改变提供的原始数组。

例子:

const users = [
{name:’John’, age:33},
{name:’Philip’, age:40},
{name:’Carl’, age:30},
{name:’Frank’, age:27},
{name:’Florin’, age:25},
{name:’Debby’, age:21},
{name:’Liam’, age:26}]
const findUser= users.find((user)=>{return user.name === ‘Debby’})
console.log(findUser)
4、forEach() 方法

forEach() 数组方法用于为数组中的每个元素调用特定的函数。

例子:

const users = [
{name:’John’, age:33},
{name:’Philip‘, age:40},
{name:’Carl‘, age:30},
{name:’Frank’, age:27},
{name:’Florin’, age:25},
{name:’Debby’, age:21},
{name:’Liam’, age:26}]
users.forEach((user)=>{console.log(user.name)})

该函数将返回给定数组中的所有名称。在大多数情况下,forEach() 方法使处理数组变得非常容易。

5、some() 方法

some() 数组方法用于检查数组中给定的一组元素是否通过特定测试。

some() 数组方法的行为就像一个纯函数。

如果传递了值,则返回true(并且不检查剩余值),否则返回false。

例子:

const users = [
{name:’John’, age:33},
{name:’Philip’, age:40},
{name:’Carl’, age:30},
{name:’Frank’, age:27},
{name:’Florin’, age:25},
{name:’Debby’, age:21},
{name:’Liam’, age:26}]
const midUsers = users.some((user)=>{return user.name <= 27})
console.log(midUsers)
6、every()方法

every() 方法执行并检查给定数组中的所有元素是否通过提供的测试。

它的行为就像一个纯函数,不会改变原始数组。

例子:

const users = [
{name:’John’, age:33},
{name:’Philip’, age:40},
{name:’Carl’, age:30},
{name:’Frank’, age:27},
{name:’Florin’, age:25},
{name:’Debby’, age:21},
{name:’Liam’, age:26}]
const everyUsers = users.every((user)=>{return user.name <= 25})
console.log(everyUsers)
7、reduce() 方法

顾名思义,它将原始数组简化为一对值,并为每个给定的值执行给定的函数。

例子:

const users = [
{name:’John’, age:33},
{name:’Philip’, age:40},
{name:’Carl’, age:30},
{name:’Frank’, age:27},
{name:’Florin’, age:25},
{name:’Debby’, age:21},
{name:’Liam’, age:26}]
const totalAge= users.reduce((curr, user)=>{return user.age + curr}, 0)
console.log(totalAge)
8、includes() 方法

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

例子:

const ages = [19,56,45,54,30,32,21,33,21,18,23,23]
const hasTwentyThree=ages.includes(23)

如果给定的测试通过,则返回 true,否则返回 false。

最后的想法

如果你喜欢阅读这篇文章并认为其他人也会喜欢它,请不要犹豫,分享它。

感谢你的阅读,编程愉快!

特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。

Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.

相关推荐
热点推荐
突发!王健林全资控股珠海万达公司,有网友爆料其真实原因…

突发!王健林全资控股珠海万达公司,有网友爆料其真实原因…

火山诗话
2024-04-23 06:39:40
落后20分最后压哨绝杀!过去25年季后赛只出现过3次 东契奇在列~

落后20分最后压哨绝杀!过去25年季后赛只出现过3次 东契奇在列~

直播吧
2024-04-23 14:48:25
一个月内,金壮龙两度南下,和王晓晖、徐麟出席重要活动

一个月内,金壮龙两度南下,和王晓晖、徐麟出席重要活动

政知新媒体
2024-04-22 20:35:16
证监会决心“壮士断腕”!4月23号,A股即将迎来反攻行情?

证监会决心“壮士断腕”!4月23号,A股即将迎来反攻行情?

风口招财猪
2024-04-23 09:22:37
女性高潮有哪些表现方式,男人请你别再骗自己了

女性高潮有哪些表现方式,男人请你别再骗自己了

皮皮讲文
2024-01-03 10:27:49
“明明在自己家,却感觉像是外国人!”多国居民不堪过度旅游大劝游客“回家吧”

“明明在自己家,却感觉像是外国人!”多国居民不堪过度旅游大劝游客“回家吧”

极目新闻
2024-04-22 18:34:24
事情严重了,6艘中舰彻底封锁仁爱礁,美航母战斗群火速开进南海

事情严重了,6艘中舰彻底封锁仁爱礁,美航母战斗群火速开进南海

旧日兮
2023-08-16 10:28:35
102岁杨振宁庆祝“瓷婚”,翁帆母亲罕露面!墙上百万名画很抢眼

102岁杨振宁庆祝“瓷婚”,翁帆母亲罕露面!墙上百万名画很抢眼

娱乐团长
2024-04-18 21:00:03
高层有老人去世家属用电梯运了遗体,邻居们十分忌讳都不敢坐电梯了

高层有老人去世家属用电梯运了遗体,邻居们十分忌讳都不敢坐电梯了

张晓磊
2024-04-05 08:39:11
湖人被绝杀,詹姆斯赛后怒斥裁判黑哨,暗示联盟操控比赛

湖人被绝杀,詹姆斯赛后怒斥裁判黑哨,暗示联盟操控比赛

阿雄侃篮球
2024-04-23 14:54:04
英国: 证实俄罗斯军队损失惨重

英国: 证实俄罗斯军队损失惨重

一种观点
2024-04-18 16:00:00
周杰伦杭州演唱会,又见精神穷人,一些人的精神贫穷是怎样形成

周杰伦杭州演唱会,又见精神穷人,一些人的精神贫穷是怎样形成

达文小火
2024-04-20 16:41:00
网易号平台每日辟谣公告(四月二十二日第二则)

网易号平台每日辟谣公告(四月二十二日第二则)

网易号官方平台
2024-04-22 18:00:12
辽宁副省长回应扭转人口流出局面:外界对辽宁预期已发生转变

辽宁副省长回应扭转人口流出局面:外界对辽宁预期已发生转变

南方都市报
2024-04-23 10:55:28
尘埃落定2024乐透抽签状元概率+所有球队签位顺序正式确定!

尘埃落定2024乐透抽签状元概率+所有球队签位顺序正式确定!

直播吧
2024-04-23 08:57:16
一群垃圾佬搞出的神级工具

一群垃圾佬搞出的神级工具

狂野音乐厅
2024-04-02 07:15:22
震惊!原来1999年,燃气公司就发明了偷气的技术,结果东窗事发!

震惊!原来1999年,燃气公司就发明了偷气的技术,结果东窗事发!

杂谈哥闲谈
2024-04-18 23:41:51
陈坤突然官宣!周迅被炸上热搜:25年了,终于公开了关系

陈坤突然官宣!周迅被炸上热搜:25年了,终于公开了关系

冰冰堂雪梨
2024-04-23 09:07:50
大反转!Lisa发文感谢Angelababy参加疯马秀,Baby撒谎被实锤了!

大反转!Lisa发文感谢Angelababy参加疯马秀,Baby撒谎被实锤了!

娱乐圈酸柠檬
2024-04-23 07:10:20
被同学下毒致惨死学生长得阳光帅气!家属发声:决不妥协!

被同学下毒致惨死学生长得阳光帅气!家属发声:决不妥协!

远荐
2024-04-22 13:44:10
2024-04-23 15:12:49
Nodejs开发
Nodejs开发
分享只有程序员懂的干货
648文章数 824关注度
往期回顾 全部

科技要闻

Meta宣布开放这一系统,自比安卓对抗苹果

头条要闻

59岁省卫健委副主任被双开 "一把手"已主动投案

头条要闻

59岁省卫健委副主任被双开 "一把手"已主动投案

体育要闻

快船独行侠G1:猛踹瘸子那条好腿

娱乐要闻

赵丽颖晒照似初恋,拍照疑与儿子分享

财经要闻

千元“特供”酒 猫腻有几何

汽车要闻

哪吒首款大五座SUV 哪吒L售价12.99万起

态度原创

艺术
房产
本地
公开课
军事航空

艺术要闻

蔚为大观,书香盛宴再启航!第三届嘉德国际艺术图书展正在呈现

房产要闻

供应量环跌71%!海口这个月又只发了5张证!

本地新闻

我和我的家乡|潍坊人真是什么都敢往天上放啊

公开课

睡前进食会让你发胖吗?

军事要闻

人民海军成立75周年:挺进深蓝 舰阵如虹

无障碍浏览 进入关怀版