当前位置: 首页 > news >正文

100 ECMAScript6数组方法

文章目录

  • 1、forEach
  • 2、map
  • 3、filter
  • 4、find
  • 5、every & some
  • 6、reduce

ECMAScript方法中提供了一些新方法,如下图所法:

在这里插入图片描述

1、forEach

对数组的每个元素执行一次提供的函数。
在这里插入图片描述
在这里插入图片描述

2、map

创建一个新数组,其结果是该数组中的每个元素都调用一次提供的回调函数后返回的结果。如果不使用return返回,默认返回undefined。用于拷贝的过程中改变一些东西或获取数组中固定的一些属性。

场景1:假定有一个数值数组(A),将A数组中的值以双倍的形式放到B数组。
在这里插入图片描述
场景2:假定有一个对象数组(A),将A数中对象某个属性的值存储到B数组中。
在这里插入图片描述
map返回的是一个新的数组。

3、filter

满足条件的留下来,不满足条件的过滤到,并以数组的形式返回。
场景1:假定有一个对象数组(A),获取数组中指定类型的对象放到B数组中。
在这里插入图片描述
场景2:假定有一个对象数组(A),过滤掉不满足以下条件的对象:条件: 蔬菜 数量大于0,价格小于10(留着的)。
在这里插入图片描述
场景3:假定有一个对象数组(A),根据指定对象的条件过滤掉数组中不符合的数据。
在这里插入图片描述

4、find

返回数组中满足回调函数的第一个元素的值,否则返回undefined。
场景1:假定有一个对象数组(A),找到符合条件的对象。
在这里插入图片描述
场景2:假定有一个对象数组(A),根据指定对象的条件找到数组中符合条件的对象。
在这里插入图片描述

5、every & some

every测试数组的所有元素是否都通过了回调函数的测试。
some测试数组中的某些元素是否通过由回调函数实现的测试。
every 一假即假,some一真则真。

场景1:计算对象数组中每个电脑操作系统是否可用。大于16位操作系统表示可用,否则不可用。
在这里插入图片描述
场景2:假定有一个注册页面,判断所有input内容的长度是否大于0。
在这里插入图片描述

6、reduce

对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个值。
场景1:计算数组中所有值的总和。
在这里插入图片描述
场景2:将数组中对象的某个属性抽离到另外一个数组中。
在这里插入图片描述
场景3:判断字符串中括号是否对称。
在这里插入图片描述

相关文章:

  • 循环神经网络
  • web安全常见漏洞 之CSRF
  • 【面试题 - mysql】进阶篇 - 分库分表
  • 中秋节——嫦娥奔月
  • 文件的上传下载
  • 数学建模学习(101):车辆路线规划问题
  • 为Ubuntu网页设置稳定的数据隧道
  • 通宵三天 我做了一个超级好玩的中秋节小游戏
  • 都这麽大了还不快了解防火墙?
  • 【名词从句】名词从句的虚拟语气、主语从句、引导名词从句
  • SpringBoot中“@SpringBootApplication“自动配置原理《第七课》
  • MySQL-3-多表查询和事务(结合案例学习)
  • Go语言 和 Java语言对比理解系列一:函数参数传递
  • Transformer模型学习笔记
  • 14.Vue3过渡和动画实现
  • [微信小程序] 使用ES6特性Class后出现编译异常
  • 【跃迁之路】【477天】刻意练习系列236(2018.05.28)
  • CSS居中完全指南——构建CSS居中决策树
  • CSS选择器——伪元素选择器之处理父元素高度及外边距溢出
  • Django 博客开发教程 8 - 博客文章详情页
  • Java基本数据类型之Number
  • Less 日常用法
  • MySQL-事务管理(基础)
  • MySQL用户中的%到底包不包括localhost?
  • Netty+SpringBoot+FastDFS+Html5实现聊天App(六)
  • PHP的类修饰符与访问修饰符
  • puppeteer stop redirect 的正确姿势及 net::ERR_FAILED 的解决
  • Python连接Oracle
  • Spring Cloud中负载均衡器概览
  • Vue 动态创建 component
  • vue--为什么data属性必须是一个函数
  • webpack+react项目初体验——记录我的webpack环境配置
  • 创建一种深思熟虑的文化
  • 从0实现一个tiny react(三)生命周期
  • 猴子数据域名防封接口降低小说被封的风险
  • 简单易用的leetcode开发测试工具(npm)
  • 前端之React实战:创建跨平台的项目架构
  • 腾讯优测优分享 | Android碎片化问题小结——关于闪光灯的那些事儿
  • hi-nginx-1.3.4编译安装
  • 格斗健身潮牌24KiCK获近千万Pre-A轮融资,用户留存高达9个月 ...
  • #define与typedef区别
  • #LLM入门|Prompt#2.3_对查询任务进行分类|意图分析_Classification
  • (3)选择元素——(14)接触DOM元素(Accessing DOM elements)
  • (day6) 319. 灯泡开关
  • (env: Windows,mp,1.06.2308310; lib: 3.2.4) uniapp微信小程序
  • (Redis使用系列) Springboot 使用redis实现接口Api限流 十
  • (Redis使用系列) SpringBoot中Redis的RedisConfig 二
  • (简单) HDU 2612 Find a way,BFS。
  • (十二)springboot实战——SSE服务推送事件案例实现
  • (四)Tiki-taka算法(TTA)求解无人机三维路径规划研究(MATLAB)
  • (转)Linq学习笔记
  • (转)详解PHP处理密码的几种方式
  • ***通过什么方式***网吧
  • .Net 8.0 新的变化
  • .NET Core 2.1路线图