for in //for of //forEach //map三种对比
遍历Array可以采用下标循环,遍历Map和Set就无法使用下标。为了统一集合类型,ES6标准引入了新的iterable类型,Array、Map和Set都属于iterable类型。
具有iterable类型的集合可以通过新的for ... of循环来遍历。
<script>
【键-->键值】
【key-->value】
var arr=[
{
name : '余佳品',
age : "26"
},
{
name : '增利',
age : "25"
},
]
/*for in 是es5的只能拿到下标(键值)for ... in循环由于历史遗留问题,它遍历的实际上是对象的属性名称。一个Array数组实际上也是一个对象,它的每个元素的索引被视为一个属性*/
for(item in arr){
console.log(item)//0 1 下标
}
/*for ... of它只循环集合本身的元素:相当于循环的键值value*/
for(item of arr){
console.log(item)//{name: "余佳品", age: "26"} {name: "增利", age: "25"}
}
/*当然最好用的还是这个,不光可以循环键还可以循环键值 最推荐,接受三个参数,第一个是value键值 第二个是key键,第三个元素是数组本身*/
arr.forEach(function (element, index, array) {
console.log(element,'****p1') //键值 {name: "余佳品", age: "26"}age: "26"name: "余佳品"__proto__: Object "****p1"
console.log(index,'****p2') //0 1 "****p2"
console.log(array,'****p3')//(2) [{…}, {…}] "****p3" 数组自己本身
})
</script>
还有一种方法是array.map方法
const array = [1, 3, 6, 9];const newArray = array.map(function (value) { return value + 1;});console.log(newArray);console.log(array); |
结果:
[2, 4, 7, 10]
[1, 3, 6, 9]
1、.map()方法使用return,进行回调;其他方法可不需要。
2、.map()方法直接对数组的每个元素进行操作,返回相同数组长度的数组;其他方法可扩展数组的长度。
Array有map()和filter()方法,可是Object没有这些方法,注意区别 参考:廖雪峰的官方网站 https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/00143450082788640f82a480be8481a8ce8272951a40970000
for in //for of //forEach //map三种对比的更多相关文章
- Map三种遍历方式
Map三种遍历方式 package decorator; import java.util.Collection; import java.util.HashMap; import java.util ...
- Mybatis之foreach用法----List、Array、Map三种类型遍历
在mybatis的xml文件中构建动态sql语句时,经常会用到标签遍历查询条件.特此记录下不同情况下书写方式!-------仅供大家参考------ 1. foreach元素的属性 collectio ...
- List,Set,Map三种接口的区别
set --其中的值不允许重复,无序的数据结构 list --其中的值允许重复,因为其为有序的数据结构 map--成对的数据结构,健值必须具有唯一性(键不能同,否则值替换) List按对象进 ...
- java 测试:iterator foreach for 三种迭代方式哪种更快?
代码: public class main { public static void main(String[] p_args){ ArrayList<String> _l_string ...
- js数组遍历some,foreach,map,filter,every对比
1. [...].some(ck)函数 ---- 某个一个为true,则为true 对数组中每个元素执行一次ck函数,知道某个元素返回true,则直接返回true.如果都返回f ...
- C/C++语言中的函数参数传参三种对比
学了很长时间C/C++有时指针方面还是有点乱. 希望大神发现如果下面有不对的地方请指出.我发现之所以我乱就是因为中文表述不准确的问题,比如 ,地址值和地址 #include <iostream& ...
- RocketMQ(6)---发送普通消息(三种方式)
发送普通消息(三种方式) RocketMQ 发送普通消息有三种实现方式:可靠同步发送.可靠异步发送.单向(Oneway)发送. 注意 :顺序消息只支持可靠同步发送. GitHub地址: https:/ ...
- 空数组在以下三种遍历中均不可更改:forEach、map和for...in
首先,我们要知道对于forEach.map和for...in三种遍历,在不是空数组的情况下,要想实现更改原数组的方法,代码如下: var list = [1,2,3,4]; var list1 = [ ...
- Map的三种遍历方式
对于Map的三种方式遍历 1.keySet() 2.values() 3.entrySet()三种方式得到Set之后,都可以使用 foreach或者iterator, 不能使用for,因为数据结构决定 ...
随机推荐
- PAT甲级1055 The World's Richest【排序】
题目:https://pintia.cn/problem-sets/994805342720868352/problems/994805421066272768 题意: 给定n个人的名字,年龄和身价. ...
- 7.26-STOIRegularMatch-08-#14
A-3 SRM 08 描述 给一个 01 串设为其 S,询问是否存在只出现两次的 01 串 T. 这里的出现定义为存在一串下标 ,满足 且 . 输入格式 一行,一个 01 串 输出格式 一行,字母 ...
- html学习_网页与html直接的关系
- okvis代码解读11
https://blog.csdn.net/datase/article/details/78586854 https://www.cnblogs.com/JingeTU/p/8540426.html ...
- novnc安装教程
适配于centos7 1.安装vncserver # stop selinux and iptables setenforce systemctl stop firewalld systemctl d ...
- hive归档分区
归档hive历史分区不会减少hdfs存储空间,但是可以有效减轻hadoop namenode的压力,尤其在于小文件比较多的情况下. $mkdir $HIVE_HOME/auxlib $ cp /opt ...
- Vue2 dist 目录下各个文件的区别
vue2 经过 2.2 版本升级后, 文件变成了 8 个: vue.common.js vue.esm.js vue.js vue.min.js vue.runtime.common.js vue.r ...
- Interceptor的基本介绍和使用
简介 java里的拦截器是动态拦截Action调用的对象,它提供了一种机制可以使开发者在一个Action执行的前后执行一段代码,也可以在一个Action执行前阻止其执行,同时也提供了一种可以提取Act ...
- js面向对象、创建对象的工厂模式、构造函数模式、原型链模式
JS面向对象编程(转载) 什么是面向对象编程(OOP)?用对象的思想去写代码,就是面向对象编程. 面向对象编程的特点 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有对象上继承出新的对象 ...
- 洛谷P3234 抄卡组 [HNOI2014] 字符串hash
正解:字符串hash 解题报告: 传送门! 字符串hash是字符串匹配中很常见的一个方法,原理也很好懂,这里就不做太多阐述辣有时间放到hash笔记里面去QAQ 题意不说了挺好理解的,自带一句话概括好评 ...