zoukankan      html  css  js  c++  java
  • 浅谈for...in与for....of

         for...in:

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

          语法:

        for (variable in object) {...}
    
          variable
    在每次迭代时,将不同的属性名分配给变量。
         object
    被迭代枚举其属性的对象

    描述

    for...in 循环只遍历可枚举属性。像 Array和 Object使用内置构造函数所创建的对象都会继承自Object.prototypeString.prototype的不可枚举属性,例如 String 的 indexOf()  方法或 ObjecttoString()方法。循环将遍历对象本身的所有可枚举属性,以及对象从其构造函数原型中继承的属性(更接近原型链中对象的属性覆盖原型属性)。

    删除,添加或者修改属性

    for...in 循环以任意序迭代一个对象的属性(请参阅delete运算符,了解为什么不能依赖于迭代的表面有序性,至少在跨浏览器设置中)。如果一个属性在一次迭代中被修改,在稍后被访问,其在循环中的值是其在稍后时间的值。一个在被访问之前已经被删除的属性将不会在之后被访问。在迭代进行时被添加到对象的属性,可能在之后的迭代被访问,也可能被忽略。通常,在迭代过程中最好不要在对象上进行添加、修改或者删除属性的操作,除非是对当前正在被访问的属性。这里并不保证是否一个被添加的属性在迭代过程中会被访问到,不保证一个修改后的属性(除非是正在被访问的)会在修改前或者修改后被访问,不保证一个被删除的属性将会在它被删除之前被访问。

    注意for...in不应该用于迭代一个 Array,其中索引顺序很重要。

    数组索引只是具有整数名称的枚举属性,并且与通用对象属性相同。不能保证for ... in将以任何特定的顺序返回索引。for ... in循环语句将返回所有可枚举属性,包括非整数类型的名称和继承的那些。

    因为迭代的顺序是依赖于执行环境的,所以数组遍历不一定按次序访问元素。因此当迭代访问顺序很重要的数组时,最好用整数索引去进行for循环(或者使用 Array.prototype.forEach() 或 for...of 循环)。

    例如:

    <!DOCTYPE html>
    <html>
    <body>

    <p>点击按钮循环对象属性。</p>

    <button onclick="myFunction()">点我</button>

    <p id="demo"></p>

    <script>
    function myFunction() {
    var person = {fname:"John", lname:"Doe", age:25};

    var text = "";
    var x;
    for (x in person) {

    text += person[x] + " ";
    }
    document.getElementById("demo").innerHTML = text;
    }
    </script>

    </body>
    </html>

    for....of:

    for...of语句可迭代对象(包括 ArrayMapSetStringTypedArrayarguments 对象等等)上创建一个迭代循环,调用自定义迭代钩子,并为每个不同属性的值执行语句。

    语法

    for (variable of iterable) {
        //statements
    }
    
    variable
    在每次迭代中,将不同属性的值分配给变量。
    iterable
    被迭代枚举其属性的对象。
    例如:

    function* foo(){
    yield 1;
    yield 2;
    }

    for (let o of foo()) {
    console.log(o);
    // expected output: 1

    break; // closes iterator, triggers return
    }

    for...offor...in的区别

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

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

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

    for each....in:

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

    作为ECMA-357(E4X)标准的一部分,for each...in语句已被废弃,E4X中的大部分特性已被删除,但考虑到向后兼容,for each...in只会被禁用而不会被删除,可以使用ES6中新的for...of语句来代替.(bug 791343.)

    for each...in 是 ECMA-357 (E4X) 标准的一部分, 大部分非Mozilla浏览器都没有实现该标准, E4X并不是 ECMAScript 标准的一部分.

    语法

    for each (variable in object) {
      statement
    }
    variable
    用来遍历属性值的变量,前面的var关键字是可选的.该变量是函数的局部变量而不是语句块的局部变量.
    object
    该对象的属性值会被遍历.
    statement
    遍历属性值时执行的语句. 如果想要执行多条语句, 请用({ ... }) 将多条语句括住.

    描述

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

    警告:永远不要使用for each...in语句遍历数组,仅用来遍历常规对象。

    (以上内容均来源于网络摘抄)

     
  • 相关阅读:
    drf 02 APIView的请求生命周期及各个模块源码分析和配置
    drf 03 序列化模块
    Django-restframework框架01
    javascript深入理解闭包(转)
    从经典问题来看 Copy 方法(转)
    JavaScript要点(七) 函数调用
    关于iOS中SQLITE句柄的使用的细节
    Xcode8 创建NSManageObject subclass方法
    JavaScript要点 (六) 函数参数
    JavaScript要点 (五) 函数定义
  • 原文地址:https://www.cnblogs.com/dxz1/p/9933322.html
Copyright © 2011-2022 走看看