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. python之工厂函数

    python之工厂函数 本人也是小白一个,最近在学习python工厂函数时随便在网上搜了搜,发现许多人对工厂函数的理解存在误区,同时也是为了整理和记录自己的思路,写下本片博文. 工厂函数顾名思义就是一 ...

  2. JIRA日期格式设置

    https://blog.csdn.net/zj911008/article/details/48312927?utm_source=blogxgwz3 https://blog.csdn.net/z ...

  3. Entity Framework 支持 DataTable

    转载:http://www.cnblogs.com/wlflovenet/archive/2011/12/30/EF11.html https://www.cnblogs.com/hanjun0612 ...

  4. Django项目创建

    一.创建方式 1.命令行创建: 2.pycharm创建项目: 二.创建MySQL数据库 三.修改配置文件链接数据库 修改python连接数据库方式 四.Django配置 1.添加app项目 2.修改h ...

  5. 一些java的demo

    //1. false System.out.println(Integer.parseInt("01")>10); //2. abcdefghijklmnopqrstuvwx ...

  6. 无分类编址(CIDR,Class Inter-Domain-Routing)

    CIDR全称是无分类域间路由选择,英文全称是Classless Inter-Domain Routing,大家多称之为无分类编址 CIDR的特点 (1)CIDR消除了传统的A类.B类和C类地址以及划分 ...

  7. linux下open-vswitch安装卸载操作

    一. ovs 从源码编译安装: 安装依赖项: ? 1 2 3 4 5 6 7 8 9 10 11 # apt install make # apt install gcc # apt install ...

  8. ARTS打卡计划第二周-Tips-mysql-binlog-connector-java的使用

    最近发现一个挺不错的框架mysql-binlog-connector-java,可以实时监控binlog的变化. 首先检查mysql的binlog是否开启,在开启的情况下: 引入依赖 <depe ...

  9. linux shell数据重定向(输入重定向与输出重定向)详细分析

    linux shell下常用输入输出操作符是: 1. 标准输入 (stdin) :代码为 0 ,使用 < 或 << : /dev/stdin -> /proc/self/fd/ ...

  10. 深入理解C++11【2】

    [深入理解C++11[2]] 1.继承构造函数. 当基类拥有多个构造函数的时候,子类不得不一一实现. C++98 可以使用 using 来使用基类的成员函数. #include < iostre ...