Traductor

Bucle for...in()

La principal función del bucle for...in(), es la de recorrer un objeto por cada una de sus propiedades, y debido a que los arrays son objetos, este bucle puede recorrer cada uno de los elementos de estos últimos. 
El bucle for...in() define dos modos de declaración
// Method 1:
for ( var VariableDeclarationNoIn in Expression )
 
// Method 2:
for ( LeftHandSideExpression  in  Expression  )
El método 1 es el mas frecuente y familiar:
  • Se declara una variable, la cual recoge cada una de las iteraciones de los atributos que componen el objeto a recorrer
<!doctype html>
<html>
    <head>
    <title>For...in()</title>
    </head>
    <body>
        <script type="text/javascript">
            var myObj = {
              foo : 1,
              bar : 2,
              otraPropiedad : 3
            }      
            for( var property in myObj ){
              document.write( property + "<br />" );
            }
        </script>
    </body>
</html>
observe como hemos empleado el nombre de la variable declarada dentro el bucle for..in(), para acceder a su contenido.

El segundo método hace referencia a cualquier expresión que pueda ser evaluada por el intérprete JavaScript. Utilizando este patrón, asignamos en cada iteración el nombre de la propiedad a la expresión resultante del primer término.
<!doctype html>
<html>
    <head>
    <title>For...in()</title>
    </head>
    <body>
        <script type="text/javascript">
            var myObj = {
                  foo : 1, 
                  bar : 2, 
                  anotherProperty : 3
                },
                myArr = [],
                i = 0;
         
            for( myArr[i++] in myObj );
             
            document.write( myArr ); 
        </script>
    </body>
</html>
De nuevo, observamos que obtenemos los nombres de las propiedades y no sus valores.
Como hemos mencionado, con este método solo se toman los nombres de las propiedades por lo que si queremos acceder también al valor, al no contar con ese nombre almacenado, debemos utilizar el propio array que estamos montando para preguntar al objeto:
<!doctype html>
<html>
    <head>
    <title>For...in()</title>
    </head>
    <body>
        <script type="text/javascript">
            var myObj = {
                  foo : 1,
                  bar : 2,
                  anotherProperty : 3
                },
                myArr = [],
                myValues = [],
                i = 0;
             
            for( myArr[i++] in myObj ){
              var lastItem = myArr.length - 1;
              myValues.push( myObj[ myArr[ lastItem ] ] );
            }
             
            document.write( myValues );
        </script>
    </body>
</html>
Este código es la única forma de acceder al valor de una propiedad, utilizando esta estructura.
En el ejemplo siguiente se muestra el uso de la instrucción for...in con un objeto que se utiliza como matriz asociativa.
<!doctype html>
<html>
    <head>
    <title>For...in()</title>
    </head>
    <body>
        <script type="text/javascript">
            // Objetos
            a = {"a" : "Atenes" , "b" : "Belgrado", "c" : "Cairo"}

            // Iteraciones
            var s = ""
            for (var id in a) {
                s += id + ": " + a[id];
                s += "<br />";
                }
            document.write (s);
        </script>
    </body>
</html>
En este ejemplo se muestra el uso de la instrucción for ... in para recorrer en iteración un objeto Array que tiene propiedades expando.
<!doctype html>
<html>
    <head>
    <title>For...in()</title>
    </head>
    <body>
        <script type="text/javascript">
            // Crear array
            var arr = new Array("cero","uno","dos");
            // Expandir propiedades del array
            arr["naranja"] = "fruta";
            arr["zanahoria"] = "vegetal";
            // Iteración
            var s = "";
            for (var id in arr) {
                s += id + ": " + arr[id];
                s += "<br />";
            }
            document.write (s);
        </script>
    </body>
</html>
Tras revisar las métricas anteriores, queda de manifiesto que el uso del bucle for...in() debería limitarse únicamente a recorrer un objeto tradicional (aquel que implementa pares de nombre/valor) y nunca un array. Esta afirmación responde a una cuestión de rendimiento patente en las estadísticas. 

Una vez asumido el punto anterior, conviene saber que existen dos formas de construir este estamento: una básica en la que definimos una variable y a la que se asigna el nombre de la propiedad correspondiente en cada iteración y, una segunda en la que dicho nombre se asocia al resultado de evaluar una expresión. Con respecto a esta última estructura, descubrimos que podemos obtener errores inesperados debido a que el intérprete puede encontrarse con expresiones sin sentido (aún correctas sintácticamente) dentro de la lógica de la instrucción. 
No podemos garantizar en ningún caso el orden en que se recorreran las propiedades de nuestro objeto por lo que, en caso de que dicho orden resulte crítico para nuestra aplicación, debemos buscar alguna forma alternativa de almacenamiento como, por ejemplo, un array tradicional.

0 comentarios:

Publicar un comentario