博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
for...in和for...of循环以及forEach方法
阅读量:4625 次
发布时间:2019-06-09

本文共 1954 字,大约阅读时间需要 6 分钟。

一、循环

1、for...in循环:可以把一个对象的所有属性依次循环出来。

var o ={     name:"jack",     age:20,     city:"beijing"};for (var key in o){      alert(key)  //"name","age","city"} 

由于Array也是对象,而它的每个元素的索引被视为对象的属性,因此,forj...in循环可以直接循环出Array的索引

var a =["A","B","C"];for (var i in a){    alert(i);       //"0","1","2"    alert(a[i]);   //"A","B","C"}

总结:for...in循环的是对象的属性;所以便利数组得到的是索引而不是值;所以要遍历数组,可以采用下标循环。

        for...in对Array的循环得到的是String而不是Number。

2、for...of循环:ES6标准引入了新的iterable类型,Array、Map和Set都属于iterable类型;

                      具有iterable类型的集合可以通过for...of循环来遍历;

                      只循环集合本身的元素

用for...of循环遍历集合,用法如下:

var a = ["A","B","C"];var s = new Set(["A","B","C"]);var m = new Map([[1,"x"],[2,"y"],[3,"z"]]);for (var x of a){     alert(x);}for (var x of s){     alert(x);}for (var x of m){     alert(x[0]+"="+x[1]);}

更好的方式是使用iterable内置的forEach方法。它接收一个函数,每次迭代就自动回调该函数。

以Array为例

var a =["A","B","C"];a.forEach(function(element,index,array)){       //element:指向当前元素的值       //index:指向当前元素索引       //array:指向Aaary对象本身       alert(element);} 

Set与Array类似,但Set没有索引,因此回调函数的前两个参数都是元素本身;

Map的回调函数参数依次是value、key和map本身。

二、rest参数

ES6引入了rest参数。看下面函数:

function foo(a,b,...rest){     console.log("a="+a);     console.log("b="+b);     console.log(rest);}foo(1,2,3,4,5);//结果//a=1//b=2//Array[3,4,5]foo(1)//结果//a=1//b=undefined//Array[]

rest参数只能写在最后,前面用...标识。从运行结果可知,传入的参数先绑定a、b,多余的参数以数组形式交给变量rest。

如果传入的参数连正常定义的参数都没有填满,rest参数会接收一个空数组(注意不是undefined)。

三、求和sum()函数

1、用rest参数和for...of循环    

function sum(...rest){     var result=0;     if (rest.length==0){            return 0;     }     for (var i of rest){           result+=i;     }     return result;} 

2、for 循环

function sum(...rest){      var result=0;      if (rest.length==0){          result=0;      }      for (var i=0;i

3、用iterable类型的forEach方法

function sum(...rest){     var result = 0;     if(rest.length==0){           result=0;     }     rest.forEach(function(element){           result+=element;     })     return result;}

 

转载于:https://www.cnblogs.com/haidaojiege/p/6936795.html

你可能感兴趣的文章
第十五篇:C程序的存储空间布局
查看>>
[Swift实际操作]七、常见概念-(2)点CGPoint和变形CGAffineTransform的使用
查看>>
npm 安装包
查看>>
JavaScript总结(五)
查看>>
case when的用法
查看>>
四、移植 JZ2440 开发板
查看>>
9.27 代码笔记
查看>>
jquery.post请求并处理返回xml数据
查看>>
es6笔记 day3---对象简介语法以及对象新增
查看>>
StringHelper.cs(20170223)
查看>>
二维码生成
查看>>
Css3新特性应用之过渡与动画
查看>>
Eclipse中如何查看当前使用的JDK版本?
查看>>
python之list的认识
查看>>
模拟器常用快捷键
查看>>
2019.04.06 电商05 动态的显示数据
查看>>
SpringMVC+springSecurity+flexPaper 配置--类似百度文库在线预览
查看>>
面向对象3
查看>>
读《程序员成长路线图:从入门到优秀》
查看>>
毕业论文管理系统各种图
查看>>