文档章节

ES6 迭代器和for-of

前端小虾
 前端小虾
发布于 2017/09/08 14:09
字数 714
阅读 6
收藏 0
点赞 0
评论 0

ECMscript定义了

1、语言规范 

2、数据类型

3、原型和继承

4、内建对象和函数的标准库

ECMScript标准不定义html或css相关的功能,也不定义类似dom的webAPI,这些都是在独立的标准中进行定义。

迭代器和for-of 循环

1、

for (var index = 0; index < myArray.length; index++) { console.log(myArray[index]);

}

2、myArray.forEach(function (value) { console.log(value);
});

,缺点:不能使用break语句中断循环,也不能使用return语句返回到外层函数。

3、for (var index in myArray) { // 千万别这样做 console.log(myArray[index]);

}

a、在这段代码中,赋给index的值不是实际的数字,而是字符串“0”、“1”、“2”,此时很可能在无 意之间进行字符串算数计算,例如:“2” + 1 == “21”,这给编码过程带来极大的不便。

b、作用于数组的for-in循环体除了遍历数组元素外,还会遍历 自定义属性。举个例子,如果你的数组中有 一个可枚举属性myArray.name,循环将额外执行一次,遍历到名为“name”的索引。就连数组原型 链上的属性都能被访问到。

c、最让人震惊的是,在某些情况下,这段代码可能按照随机顺序遍历数组元素。

d、简而言之,for-in是为普通对象设计的,你可以遍历得到字符串类型的键,因此不适用于数组遍历

4、强大的for-of循环  for(var value of myArray) { console.log(value);}

这是最简洁、最直接的遍历数组元素的语法 这个方法避开了for-in循环的所有缺陷 与forEach()不同的是,它可以正确响应break、continue和return语句

for-in循环用来遍历对象属性。 for-of循环用来遍历数据—例如数组中的值。 但是,不仅如此!

for-of循环也可以遍历其它的集合

for-of循环不仅支持数组,还支持大多数类数组对象,例如DOM NodeList对象。 for-of循环也支持字符串遍历,它将字符串视为一系列的Unicode字符来进行遍历:

for (var chr of "") { alert(chr);}

它同样支持Map和Set对象遍历

 

举个例子,Set对象可以自动排除重复项:

// 基于单词数组创建一个set对象
var uniqueWords = new Set(words);

生成Set对象后,你可以轻松遍历它所包含的内容:

for (var word of uniqueWords) { console.log(word);

}

现在,你只需记住:未来的JS可以使用一些新型的集合类,甚至会有更多的类型陆续诞生,而for-of就是 为遍历所有这些集合特别设计的循环语句。

for-of循环不支持普通对象,但如果你想迭代一个对象的属性,你可以用for-in循环(这也是它的本职工 作)或内建的Object.keys()方法:

 

 

 

© 著作权归作者所有

共有 人打赏支持
前端小虾
粉丝 0
博文 43
码字总数 21084
作品 0
东城
es6 新特性整理

本文没有详细描述这些新特性,因为网上都已经有很多相关的介绍了。主要针对ES6 新特性收集了相关范例代码,他可以让你快速了解这个新的javascript规范。 箭头函数 function() 函数的简写表示...

sinat_17775997 ⋅ 2017/12/17 ⋅ 0

【探秘ES6】系列专栏(三):生成器

ES6作为新一代JavaScript标准,即将与广大前端开发者见面。为了让大家对ES6的诸多新特性有更深入的了解,Mozilla Web开发者博客推出了《ES6 In Depth》系列文章。CSDN已获授权,将持续对该系...

一配 ⋅ 2015/10/27 ⋅ 0

【探秘ES6】系列专栏(二):迭代器和for-of循环

ES6作为新一代JavaScript标准,即将与广大前端开发者见面。为了让大家对ES6的诸多新特性有更深入的了解,Mozilla Web开发者博客推出了《ES6 In Depth》系列文章。CSDN已获授权,将持续对该系...

一配 ⋅ 2015/10/22 ⋅ 0

深入解析 ES6 系列(二)

迭代器和for-of 循环 你是如何遍历数组中的元素的? 二十年前,当 JavaScript 被发布的时候,你可能是这么做的: for (var index = 0; index < myArray.length; index++) { console.log(myA...

起名字凡人 ⋅ 2015/08/24 ⋅ 0

前端开发指南:ES6的生成器和迭代器

     ES6为JavaScript语言带来了许多新特性。其中两个特性,生成器和迭代器,极大地改变了我们在更复杂的前端代码中编写特定函数的方式。   虽然他们之间的关系很好,但他们实际上做的...

webstack前端栈 ⋅ 04/19 ⋅ 0

JavaScript——对象(查漏补缺)

说到JavaScript,我们就总是会提到对象,说到对象我们就会提到原型继承,这是我们接触JavaScript时经常会遇到的,尤其是在面试中我们也是会经常遇到。一般知道对象,理解原型看起来是足够够了...

缘自世界 ⋅ 01/11 ⋅ 0

深入理解 ES6

本文篇幅较长,有兴趣的可以先收藏再看。本文将重要的 ES6 特性介绍了一遍,并且详细解释了一些重难点。 let && const 与 的声明用法相同,但是多了一个临时死区(Temporal Distonrtion Zone...

夕阳 ⋅ 2017/09/08 ⋅ 0

那些年在异步代码上所做的努力

介绍 写过JS代码的同学应该都知道,JS是单线程的,当出现异步逻辑时,就需要使用一些技巧来实现。最常见的方法就是使用回调方法。 回调方法 比如我们要实现一个功能:1s后运行逻辑,再过3s运...

chenhao_ch ⋅ 2017/11/29 ⋅ 0

6个讨喜的 ES6 小技巧

【编者按】本文作者为 Axel Rauschmayer,主要介绍6个 ES6 小技巧。文章系国内 [ITOM][1] 管理平台 [OneAPM][2] 编译呈现。 在本文中,笔者将介绍6个由 ES6 新功能带来的小技巧。在每个技巧末...

OneAPM蓝海讯通 ⋅ 2016/06/06 ⋅ 0

ES6中常用的10个新特性讲解

ECMAScript 6(ES6) 目前基本成为业界标准,它的普及速度比 ES5 要快很多,主要原因是现代浏览器对 ES6 的支持相当迅速,尤其是 Chrome 和 Firefox 浏览器,已经支持 ES6 中绝大多数的特性。 ...

木亦Sam ⋅ 06/10 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Spring | IOC AOP 注解 简单使用

写在前面的话 很久没更新笔记了,有人会抱怨:小冯啊,你是不是在偷懒啊,没有学习了。老哥,真的冤枉:我觉得我自己很菜,还在努力学习呢,正在学习Vue.js做管理系统呢。即便这样,我还是不...

Wenyi_Feng ⋅ 今天 ⋅ 0

博客迁移到 https://www.jianshu.com/u/aa501451a235

博客迁移到 https://www.jianshu.com/u/aa501451a235 本博客不再更新

为为02 ⋅ 今天 ⋅ 0

win10怎么彻底关闭自动更新

win10自带的更新每天都很多,每一次下载都要占用大量网络,而且安装要等得时间也蛮久的。 工具/原料 Win10 方法/步骤 单击左下角开始菜单点击设置图标进入设置界面 在设置窗口中输入“服务”...

阿K1225 ⋅ 今天 ⋅ 0

Elasticsearch 6.3.0 SQL功能使用案例分享

The best elasticsearch highlevel java rest api-----bboss Elasticsearch 6.3.0 官方新推出的SQL检索插件非常不错,本文一个实际案例来介绍其使用方法。 1.代码中的sql检索 @Testpu...

bboss ⋅ 今天 ⋅ 0

informix数据库在linux中的安装以及用java/c/c++访问

一、安装前准备 安装JDK(略) 到IBM官网上下载informix软件:iif.12.10.FC9DE.linux-x86_64.tar放在某个大家都可以访问的目录比如:/mypkg,并解压到该目录下。 我也放到了百度云和天翼云上...

wangxuwei ⋅ 今天 ⋅ 0

PHP语言系统ZBLOG或许无法重现月光博客的闪耀历史[图]

最近在写博客,希望通过自己努力打造一个优秀的教育类主题博客,名动江湖,但是问题来了,现在写博客还有前途吗?面对强大的自媒体站点围剿,还有信心和可能型吗? 至于程序部分,我选择了P...

原创小博客 ⋅ 今天 ⋅ 0

IntelliJ IDEA 2018.1新特性

工欲善其事必先利其器,如果有一款IDE可以让你更高效地专注于开发以及源码阅读,为什么不试一试? 本文转载自:netty技术内幕 3月27日,jetbrains正式发布期待已久的IntelliJ IDEA 2018.1,再...

Romane ⋅ 今天 ⋅ 0

浅谈设计模式之工厂模式

工厂模式(Factory Pattern)是 Java 中最常用的设计模式之一。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。 在工厂模式中,我们在创建对象时不会对客户端暴露创建逻...

佛系程序猿灬 ⋅ 今天 ⋅ 0

Dockerfile基础命令总结

FROM 指定使用的基础base image FROM scratch # 制作base image ,不使用任何基础imageFROM centos # 使用base imageFROM ubuntu:14.04 尽量使用官方的base image,为了安全 LABEL 描述作...

ExtreU ⋅ 昨天 ⋅ 0

存储,对比私有云和公有云的不同

导读 说起公共存储,很难不与后网络公司时代的选择性外包联系起来,但尽管如此,它还是具备着简单和固有的可用性。公共存储的名字听起来也缺乏专有性,很像是把东西直接堆放在那里而不会得到...

问题终结者 ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部