`
yuyongkun4519
  • 浏览: 43101 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

ES6 for..of详解

 
阅读更多

es6新加了遍历方法for..of,今天看看怎么使用

 

遍历数组值

let arr=['red','green','blue','orange'];
for(let val of arr){
  console.log(val);
}

 

怎么把索引打印出来呢?

 

如果想要打印出索引可以这样

let arr=['red','green','blue','orange'];
for(let index of arr.keys()){
  console.log(index );//0,1,2,3
}

 

还可以这样

let arr=['red','green','blue','orange'];
for(let item of arr.entries()){
  console.log(item[0]);//red,green,blue,orange
}

 

能否key和value一块打印出来呢?

let arr=['red','green','blue','orange'];
for(let [key,val] of arr.entries()){
  console.log(key,val);
}

是不是很简单^_^

 

遍历对象

 

//Object.keys
let param = {
        name: "zhangsan",
        age: 21,
        sex: "male"
    };
for (let key of Object.keys(param)) {
     console.log(key);//name,age,sex
}
 
//Object.values
let param = {
        name: "zhangsan",
        age: 21,
        sex: "male"
    };

for (let value of Object.values(param)) {
     console.log(value);//zhangsan,21,male
}
 
//Object.entries
let param = {
        name: "zhangsan",
        age: 21,
        sex: "male"
    };

for (let [key,value] of Object.entries(param)) {
     console.log(key,value);//name "zhangsan", age 21, sex "male"
}
 

 

 
分享到:
评论

相关推荐

    【JavaScript源代码】ES6的循环与可迭代对象示例详解.docx

    ES6的循环与可迭代对象示例详解  本文将研究 ES6 的 for ... of 循环。 在过去,有两种方法可以遍历 javascript。 首先是经典的 for i 循环,它使你可以遍历数组或可索引的且有 length 属性的任何对象。 for(i=0...

    ES6入门教程之Iterator与for...of循环详解

    最近在学习ES6,刚刚看到Iterator和for...of循环这一章,所以想要跟大家略微分享一下,下面这篇文章主要给大家介绍了关于ES6入门学习中Iterator与for...of循环的相关资料,不足之处还望大家多多指正,需要的朋友们...

    【JavaScript源代码】JavaScript 语句之常用 for 循环详解.docx

     JavaScript中循环语句不少,for、for in、for of和forEach循环,今天对比Array、Object、Set(ES6)、Map(ES6)四种数据结构循环语句支持的情况及区别。 新建四种数据类型的测试数据 let arr = [1, 2, 3, 4, 5, 6];...

    ES6新特性二:Iterator(遍历器)和for-of循环详解

    本文实例讲述了ES6新特性之Iterator(遍历器)和for-of循环。分享给大家供大家参考,具体如下: 1. 遍历数组 for-of工作原理:迭代器有一个next方法,for循环会不断调用这个iterator.next方法来获取下一个值,直到...

    详解ES6语法之可迭代协议和迭代器协议

    可迭代协议允许 JavaScript 对象去定义或定制它们的迭代行为, 例如(定义)在一个 for..of 结构中什么值可以被循环(得到)。一些内置类型都是内置的可迭代对象并且有默认的迭代行为, 比如 Array or Map, 另一些类型...

    详解ES6之async+await 同步/异步方案

    异步编程一直是JavaScript 编程的重大事项。关于异步方案, ES6 先是出现了 基于状态管理的 Promise,然后出现了 Generator 函数 + co 函数,紧...for (let val of [1, 2, 3, 4]) { setTimeout(() => console.log(val

    ES6中Set和Map用法实例详解

    本文实例讲述了ES6中Set和Map用法。分享给大家供大家参考,具体如下: Set ES6提供了新的数据结构Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。...for (let i of s) { console.log(i); } // 2 3 5 4 注

    ES6 迭代器与可迭代对象的实现

    ES6 新的数组方法、集合、for-of 循环、展开运算符(…)甚至异步编程都依赖于迭代器(Iterator )实现。本文会详解 ES6 的迭代器与生成器,并进一步挖掘可迭代对象的内部原理与使用方法 一、迭代器的原理 在编程...

    深入浅出ES6 简体中文

    借鉴了C++、Java、C#以及Python等语言的for-of循环语句;部分借鉴Mustache、Nunjucks的模板字符串。 当然,新的语言体系也在之前的基础上查漏补缺:弥补块级作用域变量缺失的let和const关键字;弥补面向大型项目缺失...

    ES6中的rest参数与扩展运算符详解

    前言 本文主要给大家介绍了关于ES6中rest参数与扩展运算符的相关内容,rest参数和扩展运算符都是ES6新增的特性。rest参数的形式为:…变量... for (var val of values) { sum += val; } return sum; } add(1, 2, 3)

    ES6基础之字符串和函数的拓展详解

    1.ES6为字符串添加了遍历器接口,因此可以使用for…of循环遍历字符串 2.字符串新增的 includes()、startsWith()、endsWidth() 三个方法用于判断某一字符串是否包含于另一字符串 includes():返回布尔值,表示源字符...

    ECMAScript6中Set/WeakSet详解

    ES6里加入了一个新数据解构Set,和Java的Set一样,它里面不存放重复的元素。Set实现为一个类,使用时需要先new。 var s1 = new Set() s1.add(1) s1.add(2) s1.add(3) s1.add(1) var s2 = new Set() s2.add('a') s2....

Global site tag (gtag.js) - Google Analytics