ES6笔记一
遍历数组:
1:传统的
for (var index = 0; index < myArray.length; index++) {
console.log(myArray[index]);
}
2 内建的 forEach 方法
myArray.forEach(function (value) {
console.log(value); //value不是下标而是数组内容
});
但是此方法不能使用 break 语句中断循环,也不能使用 return 语句返回到外层函数。
3:for-in 循环
for (var index in myArray) { // 千万别这样做
console.log(myArray[index]);
}
在这段代码中,赋给 index 的值不是实际的数字,而是字符串“0”、“1”、“2”,
此时很可能在无意之间进行字符串算数计算,例如:“2” + 1 == “21”,这给
编码过程带来极大的不便。
在某些情况下,这段代码可能按照随机顺序遍历数组元素。
简而言之,for-in 是为普通对象设计的,你可以遍历得到字符串类型的键,
因此不适用于数组遍历。
for-in适用于普通对象和哈希(hash)数组
hash数组的创建只有一种方法
var foo = [];
foo['name'] = 'tom';
foo['sex'] = 'man'; 4:ES6 中增加了一种新的for-of循环语法 for (var value of myArray) {
console.log(value);//value不是下标而是数组内容
}
这个方法避开了 for-in 循环的所有缺陷
与 forEach()不同的是,它可以正确响应 break、continue 和 return 语句 for-of 循环不仅支持数组,还支持大多数类数组对象,例如 DOM NodeList 对象。
for-of 循环也支持字符串遍历,它将字符串视为一系列的 Unicode 字符来进行遍历:
for (var chr of "qwqew") {
alert(chr);//分别输出:q w q e w
}
它同样支持 Map 和 Set 对象遍历。 Set 对象可以自动排除重复项:
// 基于单词数组创建一个 set 对象
var uniqueWords = new Set(words);
生成 Set 对象后,你可以轻松遍历它所包含的内容:
for (var word of uniqueWords) {
console.log(word);
}
Map 对象稍有不同:内含的数据由键值对组成,所以你需要使用解构(destructuring)
来将键值对拆解为两个独立的变量: for (var [key, value] of phoneBookMap) {
console.log(key + "'s phone number is: " + value);
} for-of 循环不支持普通对象,但如果你想迭代一个对象的属性,你可以用 for-in 循
环(这也是它的本职工作)或内建的 Object.keys()方法:
// 向控制台输出对象的可枚举属性
for (var key of Object.keys(someObject)) {
console.log(key + ": " + someObject[key]);
} 当你向任意对象添加 myObject[Symbol.iterator]()迭代器方法,就可以遍历这个对象
假设你正在使用 jQuery,尽管你非常钟情于里面的.each()方法,但你还
是想让 jQuery 对象也支持 for-of 循环,你可以这样做:
jQuery.prototype[Symbol.iterator] = Array.prototype[Symbol.iterator];
这里通过 Symbol 处理了一下方法的名称。标准委员会可以把这个方法命
名为.iterator()方法,但是如果你的代码中的对象可能也有一些.iterator()方法,这一定会
让你感到非常困惑。于是在 ES6 标准中使用 symbol 来作为方法名,而不是使用字符串
Symbols 是 ES6 中的新类型,基于新标准,你可以定义一个全新的 symbol,就像 Symbol.iterator,如此
一来可以保证不与任何已有代码产生冲突。
所有拥有[Symbol.iterator]()的对象被称为可迭代的
ES6笔记一的更多相关文章
- ES6笔记(5)-- Generator生成器函数
系列文章 -- ES6笔记系列 接触过Ajax请求的会遇到过异步调用的问题,为了保证调用顺序的正确性,一般我们会在回调函数中调用,也有用到一些新的解决方案如Promise相关的技术. 在异步编程中,还 ...
- ES6笔记系列
ES6,即ECMAScript 6.0,ES6的第一个版本是在2015年发布的,所以又称作ECMAScript 2015 如今距ES6发布已经一年多的时间,这时候才去学,作为一个JSer,羞愧羞愧,还 ...
- ES6笔记(1) -- 环境配置支持
系列文章 -- ES6笔记系列 虽然ES6已经发布一年多了,但在各大浏览器之中的支持度还不是很理想,在这查看ES6新特性支持度 Chrome的最新版本浏览器大部分已经支持,在Node.js环境上支持度 ...
- ES6笔记(2)-- let的块级作用域
系列文章 -- ES6笔记系列 一.函数级作用域 我们都知道,在ES6以前,JS只有函数级作用域,没有块级作用域这个概念 没有块级作用域,有利有弊,利于方便自由,弊于作用域内的变量容易被共享,例如这个 ...
- ES6笔记(3)-- 解构赋值
系列文章 -- ES6笔记系列 解构赋值,即对某种结构进行解析,然后将解析出来的值赋值给相关的变量,常见的有数组.对象.字符串的解构赋值等 一.数组的解构赋值 function ids() { ret ...
- ES6笔记(4)-- Symbol类型
系列文章 -- ES6笔记系列 Symbol是什么?中文意思是标志.记号,顾名思义,它可以用了做记号. 是的,它是一种标记的方法,被ES6引入作为一种新的数据类型,表示独一无二的值. 由此,JS的数据 ...
- ES6笔记(6)-- Set、Map结构和Iterator迭代器
系列文章 -- ES6笔记系列 搞ES6的人也是够无聊,把JS弄得越来越像Java.C++,连Iterator迭代器.Set集合.Map结构都出来了,不知道说什么好... 一.简单使用 1. iter ...
- ES6笔记(7)-- Promise异步编程
系列文章 -- ES6笔记系列 很久很久以前,在做Node.js聊天室,使用MongoDB数据服务的时候就遇到了多重回调嵌套导致代码混乱的问题. JS异步编程有利有弊,Promise的出现,改善了这一 ...
- ES6 笔记汇总
ES6 笔记汇总 二.ES6基础-let和const命令 三.变量的解构赋值 四.字符串的拓展 五.正则表达式的拓展 ...将会持续更新,敬请期待
- ES6笔记2
ES6笔记2 Promise Promise 是 ES6 引入的异步编程的新解决方案,语法上是一个构造函数 一共有3种状态,pending(进行中).fulfilled(已成功)和rejected(已 ...
随机推荐
- sql高级语句大全
经典SQL语句大全 一.基础 1.说明:创建数据库 CREATE DATABASE database-name 2.说明:删除数据库 drop database dbname 3.说明:备份sql s ...
- Html5-canvas
Html5-canvas: 坐标是x向右,逐步增大, y坐标向下增大,原点在画布的左上角.长度单位是一个像素: 像素是一个密度单位,而厘米是长度单位,两者无法比较: Html5的绘图函数: 2. ...
- TCP Socket 通讯(客户端与服务端)
/*----------------------------编译环境:VS2015---------------------------------------*/ /*--------------- ...
- UIButtonTypeSystem backBarButtonItem
当UIButton是UIButtonTypeSystem类型时,改变UIButton的frame,系统会有一个动画改变效果,不想要这个效果,将类型改为UIButtonTypeCustom. backB ...
- IE 文档模式
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv= ...
- 循序渐进redis(一) —— redis的安装及可视化工具的使用
1.安装 注意事项: 1.安装gcc 2.编译带参数: make MALLOC=libc 2.可视化客户端工具 推荐使用RedisClient,提供了基本的CRUD以及过期设置等操作的图形化接口,在项 ...
- Microsoft .NET Framework 4.6.1
适用于操作系统平台:Windows 7 SP1.Windows 8.Windows 8.1.Windows 10.Windows Server 2008 R2 SP1.Windows Server 2 ...
- 2014年6月份第4周51Aspx源码发布详情
通用医院会员管理系统源码 2014-6-23 [VS2010]功能介绍:本系统共包括以下模块:会员开卡管理.会员充值管理.会员消费管理.会员病例管理.客户预约管理.系统信息管理(门诊管理.卡类型管理 ...
- KTV项目 SQL数据库的应用 结合C#应用窗体
五道口北大青鸟校区 KTV项目 指导老师:袁玉明 歌曲播放原理 SQL数据库关系图 C#解决方案类图 第一步:创建数据库连接方法和打开方法和关闭方法! public class DBHelper { ...
- Apache Tomcat开机后台启动
作为软件开发人员,经常接触Tomcat,完成的项目,需要部署到服务器上的Tomcat,才能供其他人访问浏览. 因为存在以下问题,所以需要把Tomcat设置为后台自动启动: 1.服务器可能因环境故障面临 ...