Header Ads Widget

Ticker

6/recent/ticker-posts

Subrayar JS cada función

 


Como mencionamos, las diversas funciones de colección en Underscore realmente nos ayudan a navegar por los objetos y matrices de JavaScript de una manera realmente fácil y directa. En este tutorial en particular, veremos la eachfunción y cómo podemos usarla con matrices, objetos, matrices con contexto, así como objetos con contexto. Cuando decimos con contexto, todo lo que realmente queremos decir es a qué thisapuntará la palabra clave durante partes particulares de la ejecución del código. La eachfunción es realmente una de esas funciones de tipo pan y mantequilla que solo tiene que conocer, así que profundicemos ahora y mejoremos en el trabajo con eachUnderscore.



_.cada()

_.each () con matrices

En primer lugar, veremos cómo trabajar con una matriz simple con la eachfunción. En este primer ejemplo, tenemos una matriz simple de carsVeamos si podemos iterar sobre cada automóvil en la carsmatriz para hacer algo interesante. La forma en que hacemos esto es llamar a la eachfunción y pasar la carsmatriz como primer parámetro. El segundo parámetro de la eachllamada es nuestra función de iterador . Esta función se ejecuta en cada bucle a través de la matriz, en cada elemento de la matriz. Cuando continúa y hace clic en el botón para ejecutar el código, podemos ver cuatro líneas de salida correspondientes a cada elemento en elcarsformación. Al observar la firma de la función del iterador, tenemos un elemento (se refiere a un elemento en la matriz), un índice (el índice numérico de cada elemento) y el argumento de lista que hace referencia a los datos originales.

Hacer clic Claro


.each () con un objeto

Este ejemplo se centrará en ver cómo funciona cada uno cuando se trata de un objeto JavaScript. Ahora eche un vistazo a eso sampleobjecty observe que tiene un FirstKeyde OneSecondKeyde TwoCon nuestra sampleobjectconfiguración, luego hacemos una llamada a la eachfunción, y lo adivinaste, pasamos eso sampleobjectallí mismo como el primer argumento. Entonces, ¿qué quieres hacer con eso sampleobjectBueno, ahí es donde entra en juego nuestra práctica función de iterador (la función anónima pasada como segundo argumento). En este ejemplo, nuestro iterador tiene una firma de valuekeyComo tal, tenemos acceso a esos valores dentro del iterador y los usamos para imprimir información útil sobre el objeto.

Hacer clic Claro


_.each () y matrices con contexto

A continuación, veremos cómo trabajar con eachmatrices y, pero también configuraremos el contexto . Continúe y haga clic en el botón para ejecutar el código y observe la salida de

  • Microsoft crea excelentes productos.
  • Google crea excelentes productos.
  • Amazon crea excelentes productos.
  • Apple crea excelentes productos.

Podemos ver que cuando llamamos a la eachfunción, TechCompanies.namesse pasa como primer argumento a la función. Este objeto también tiene una función anidada que podemos ver que se llama doStuffHacemos uso de esa función de iterador familiar que incluye el elemento, el índice y la lista. Observe que después de la función de iterador pasamos TechCompaniescomo contexto . Esto vincula el TechCompaniesobjeto a la thispalabra clave dentro del iterador. ¿Ves cómo funciona eso? Esto es lo que hace posible realizar la llamada a this.doStuff()en el iterador, y sabe dónde encontrar esa función. Si no hubiera pasado contexto, la thispalabra clave estaría haciendo referencia a la función del iterador y eso no es lo que queremos en este caso.

Hacer clic Claro


Objeto con contexto

Finalmente, podemos echar un vistazo a la configuración del contexto con cada uno cuando se trata de un Objeto. Si ejecuta el código, verá este resultado.

  • Este Tesla tiene piloto automático
  • Este Tesla tiene función de invocación
  • Este Tesla tiene modo ridículo

Una gran razón para salir y comprar un buen Tesla. Entonces, este ejemplo hace uso de dos objetos. El primer objeto es el objeto de características, y contiene todas las características de un auto genial. El objeto de vendedor contiene funciones como getPitch y sellCar. En la llamada a cada uno, iteramos sobre el objeto de características y luego configuramos nuevamente una función de iterador como segundo argumento. Sin embargo, no terminamos ahí, ya que también pasamos al vendedor como contexto para cada función. Por lo tanto, cuando hacemos una llamada a this.sellCar en el iterador, sabe buscar esa función dentro del objeto de vendedor, ya que esto es lo que se pasó como contexto.

Hacer clic Claro


Subrayar JS Resumen de cada función

En este tutorial, analizamos de cerca el trabajo con cada () en la biblioteca de subrayado. Los cuatro ejemplos fueron definitivamente útiles para comprender mejor cómo funciona cada uno con matrices y objetos. También nos pusimos al día con la configuración adecuada del contexto al tratar tanto con matrices como con objetos.


Publicar un comentario

0 Comentarios