for each...in

  使用一个变量迭代一个对象的所有属性值,对于每一个属性值,有一个指定的语句块被执行。

  一些对象的内置属性是无法被遍历到的,包括所有的内置方法,例如String对象的indexOf方法。不过大部分的用户自定义属性都是可遍历的。

  【警告:永远不要使用  for each...in语句遍历数组,仅用来遍历常规对象。(有可能会对数组顺序发生改变)】

  语法:

    for each (variable in object) {
      statement
    }

  参数:

    variable

      用来遍历属性值的变量,前面的var关键字是可选的。该变量是函数的局部变量而不是语句块的局部变量。

    object

      该对象的属性值会被遍历。

    statement

      遍历属性值时执行的语句。 如果想要执行多条语句, 请用({ ... }) 将多条语句括住。

  eg:

    var sum = 0;
    var obj = {prop1: 5, prop2: 13, prop3: 8};

    for each (var item in obj) {
    sum += item;
    }

    console.log(sum);

    // output:logs "26", which is 5+13+8

for...in

  以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性,语句都会被执行。

  for...in 循环只遍历可枚举属性。

  像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototype和String.prototype的不可枚举属性。

  语法:

    for (variable in object) {...}

  参数:

    variable

      在每次迭代时,将不同的属性名分配给变量。

    object

      被迭代枚举其属性的对象。

  eg:

    var obj = {a: 1, b: 2, c: 3};

    for (const prop in obj) {
    console.log(`obj.${prop} = ${obj[prop]}`);
    }

    // Output:
    // "obj.a = 1"
    // "obj.b = 2"
    // "obj.c = 3"

for...of

  在可迭代对象(包括 Array,Map,Set,String,TypedArray,arguments 对象等等)上创建一个迭代循环,调用自定义迭代例子,并为每个不同属性的值执行语句。

  对于for...of的循环,可以由break, throw 或return终止。

  语法:

     for (variable of iterable) {
      //statements
      }

  参数:

    variable

      在每次迭代中,将不同属性的值分配给变量。

    iterable

      被迭代枚举其属性的对象。

  eg:

    let iterable = [10, 20, 30];

    for (let value of iterable) {
      value += 1;
      console.log(value);
    }

    // 11
    // 21
    // 31

-------------------------------------------------------------------------------------------------------------------------------
关于  for...in  和  for...of 之间的区别:

  无论是for...in还是for...of语句都是迭代一些东西。它们之间的主要区别在于它们的迭代方式。

  for...in 语句以原始插入顺序迭代对象的可枚举属性。

  for...of 语句遍历可迭代对象定义要迭代的数据。

----关于JS中迭代的三个“FOR”----的更多相关文章

  1. js中迭代元素特性与DOM中的DocumentFragment类型 笔记

    JS中迭代元素特性 在需要将DOM结构序列化为XML或者HTML字符串时,多数都会涉及遍历元素的特性,这个时候attributes属性就可以派上用场. 以下代码展示了如何迭代元素的每一个特性,然后将他 ...

  2. js中confirm揭示三个按钮“是”“否”“取消”

    js中confirm提示三个按钮“是”“否”“取消” 重载DOM中confirm window.confirm = function(str) {   str=str.replace(/\'/g, & ...

  3. js中addEventListener第三个参数涉及到的事件捕获与冒泡

    js中,我们可以给一个dom对象添加监听事件,函数就是 addEventListener("click",function(){},true); 很容易理解,第一个参数是事件类型, ...

  4. 关于原生js中函数的三种角色和jQuery源码解析

    原生js中的函数有三种角色: 分两大种: 1.函数(最主要的角色)2.普通对象(辅助角色):函数也可以像对象一样设置属于本身的私有属性和方法,这些东西和实例或者私有变量没有关系两种角色直接没有必然的关 ...

  5. JS 中 原生方法 (三) --- Date 日期

    本文也说主要阐释了 Javascript 中的基础类型和 引用类型的自带方法,那么熟悉的同学又可以绕道了 总是绕道,真是羞耻悳boy 当然 本文阐述的主要类容 from MDN ( zh-cn ) D ...

  6. js中迭代方法

    基础遍历数组:            for()            for( in )             for(var i = 0;i<arr.length;i++){       ...

  7. js中创建对象的三种方式

    1. 对象字面量 var obj={ name:"小小", age:3, car:{ brand:"baoma", } }; } 2.使用内置构造函数 var ...

  8. js中迭代的常用几种方法

    var arr = [1,3,2,5,3]; //forEach 两个参数,第一个为数组内容,第二个为数组下标arr.forEach(function(item,index) { console.lo ...

  9. JS中var声明与function声明以及构造函数声明方式的区别

    JS中常见的三种函数声明(statement)方式有这三种: // 函数表达式(function expression) var h = function () { // h } // 函数声明(fu ...

随机推荐

  1. asp.net 微信开发(二)

    本节我们主要讲解微信的调试: 前言:平时我们开发项目都是在本地就能进行项目的开发调试,但是在微信上就有难度了,因为微信的数据需要从微信服务器上面拿,所以就需要直接在网站上调试了,接下来就相关的一些个人 ...

  2. oracle EBS SLQ语句

    1.查询公司主体 SELECT a.flex_value_id,b.flex_value,B.SUMMARY_FLAG,A.flex_value_meaning,c.flex_value_set_na ...

  3. vue keep-alive 原理

    前人种树:https://segmentfault.com/a/1190000011978825 add : 使用 keep-alive 组件后,组件生命周期会新引入两个钩子

  4. html页面转jsp后 乱码问题。

    在jsp文件中的html显示乱码是因为服务端和客户端的编码不一致导致的.如果Java和JSP编译成class文件过程中,使用的编码方式与源文件的编码不一致,就会出现乱码.解决办法:1.未指定使用字符集 ...

  5. CentOS 7 用户及权限管理

    用户及组的管理: 安全上下文: 进程以其发起者的身份运行: 进程对文件的访问权限,取决于发起此进程的用户的权限 系统用户:为了能够让那些后台进程或服务类进程以非管理员的身份运行,通常需要为此创建多个普 ...

  6. leetcode125. Valid Palindrome

    Given a string, determine if it is a palindrome, considering only alphanumeric characters and ignori ...

  7. open()函数 linux中open函数使用

    来源:http://www.cnblogs.com/songfeixiang/p/3733855.html   linux中open函数使用 open函数用来打开一个设备,他返回的是一个整型变量,如果 ...

  8. 网上Java总结

    1.         编译 javac 文件名.java 运行 java 文件名 2.         Public class 和 class 声明类的区别:public 声明的文件名必须和其类名一 ...

  9. 20175213 2018-2019-2 《Java程序设计》第8周学习总结

    教材学习内容总结 1:泛型主要目的是建立具有类型安全的集合框架,如链表,散列映射等数据结构. 泛型类的声明: class People<E> People是泛型类的名称,E是其中泛型,E可 ...

  10. springboot日志logback配置

    <?xml version="1.0" encoding="UTF-8"?> <!-- scan:当此属性设置为true时,配置文件如果发生改 ...