遍历Array可以采用下标循环,遍历MapSet就无法使用下标。为了统一集合类型,ES6标准引入了新的iterable类型,ArrayMapSet都属于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()方法直接对数组的每个元素进行操作,返回相同数组长度的数组;其他方法可扩展数组的长度。

Arraymap()filter()方法,可是Object没有这些方法,注意区别

参考:廖雪峰的官方网站 https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/00143450082788640f82a480be8481a8ce8272951a40970000

for in //for of //forEach //map三种对比的更多相关文章

  1. Map三种遍历方式

    Map三种遍历方式 package decorator; import java.util.Collection; import java.util.HashMap; import java.util ...

  2. Mybatis之foreach用法----List、Array、Map三种类型遍历

    在mybatis的xml文件中构建动态sql语句时,经常会用到标签遍历查询条件.特此记录下不同情况下书写方式!-------仅供大家参考------ 1. foreach元素的属性 collectio ...

  3. List,Set,Map三种接口的区别

    set --其中的值不允许重复,无序的数据结构 list   --其中的值允许重复,因为其为有序的数据结构  map--成对的数据结构,健值必须具有唯一性(键不能同,否则值替换)   List按对象进 ...

  4. java 测试:iterator foreach for 三种迭代方式哪种更快?

    代码: public class main { public static void main(String[] p_args){ ArrayList<String> _l_string ...

  5. js数组遍历some,foreach,map,filter,every对比

    1.  [...].some(ck)函数       ----      某个一个为true,则为true 对数组中每个元素执行一次ck函数,知道某个元素返回true,则直接返回true.如果都返回f ...

  6. C/C++语言中的函数参数传参三种对比

    学了很长时间C/C++有时指针方面还是有点乱. 希望大神发现如果下面有不对的地方请指出.我发现之所以我乱就是因为中文表述不准确的问题,比如 ,地址值和地址 #include <iostream& ...

  7. RocketMQ(6)---发送普通消息(三种方式)

    发送普通消息(三种方式) RocketMQ 发送普通消息有三种实现方式:可靠同步发送.可靠异步发送.单向(Oneway)发送. 注意 :顺序消息只支持可靠同步发送. GitHub地址: https:/ ...

  8. 空数组在以下三种遍历中均不可更改:forEach、map和for...in

    首先,我们要知道对于forEach.map和for...in三种遍历,在不是空数组的情况下,要想实现更改原数组的方法,代码如下: var list = [1,2,3,4]; var list1 = [ ...

  9. Map的三种遍历方式

    对于Map的三种方式遍历 1.keySet() 2.values() 3.entrySet()三种方式得到Set之后,都可以使用 foreach或者iterator, 不能使用for,因为数据结构决定 ...

随机推荐

  1. PHP一个小函数

    // function makeTemp($fileName="index",$ftype=0) { $tempPath="xx/xxxx/{$fileName}.htm ...

  2. HDU 1506 & 1505 - Largest Rectangle in a Histogram & City Game

    Largest Rectangle in a Histogram Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 ...

  3. es6/ts for in/ for of

    for in 是es6之前就有的循环下标的方式 for of 是typescript的循环对象或者数组中值的方式,但是不能循环普通的对象,需要通过和Object.keys()搭配使用,如果循环普通对象 ...

  4. tp5, laravel, yii2我该选择哪个

    为什么写这篇文章 我个人有一个技术群,里面学什么框架的都有,经常会有人问 某某功能 在 哪个框架怎么实现,用什么框架实现更好,说道这里我大家讲一个同类型问题的笑话 某女:你能让这个论坛的人都吵起来,我 ...

  5. 第三方python 加密库 --- cryptography

    1,安装依赖 pip install cryptography 2,生成秘钥 from cryptography.fernet import Fernet #秘钥#随机生成秘钥 cipher_key ...

  6. 洛谷P1315 观光公交 [noip2011D2T3] 贪心

    正解:贪心 解题报告: 这里是链接! 唔我觉得还是很容易想到是贪心的,这个难就难在怎么贪心 下面列一下常见的几个贪心思想: 1)根据车上的人数排序,人最多的那条路用加速器 错误,人数多并不意味着加速的 ...

  7. eslint 在VSCode中不能使用

    在VSCode中安装号eslint插件,还是不能使用,还需安装 npm install eslint-plugin-promise --save-dev 我也不知道为什么?我现在只是用两天不到vsco ...

  8. es分页搜索

    1.es分页语法GET /_search?from=起始数&size=页面显示条数例如:GET /test_index/test_type/_search?from=0&size=3 ...

  9. oracle中varchar2(2)存不了一个汉字的原因

    错误提示: 一个汉字占了三个字节,而不是两个,这跟字符集有关. 查一下字符集:select userenv('language') from dual; 结果显示,本机Oracle的字符集是UTF-8 ...

  10. spring学习(02)之配置文件没有提示问题

    配置文件没有提示问题 1 spring引入schema约束,把约束文件引入到eclipse中 (1)复制约束路径 http://www.springframework.org/schema/beans ...