Saltar al contenido

Entradas de objeto

Arreglando "0" en su código JSX

Navegar y administrar estructuras de datos es una habilidad realmente importante que todo ingeniero debe tener y mejorar. A lo largo de los años, el lenguaje JavaScript ha proporcionado cada vez más métodos para administrar estructuras de datos, desde Object.keys a Object.values y así. Uno de mis favoritos es Object.entries, una API que proporciona las claves y los valores a través de una matriz de matrices. ¡Echemos un vistazo!

Considere el siguiente objeto:

const obj = {
    name: "David",
    color: "green",
    balance: 100
}

Tradicionalmente hemos iterado sobre claves con un for Repita y luego use la sintaxis de matriz para obtener valores:

const obj = {
    name: "David",
    color: "green",
    balance: 100
}

for (const key in obj) {
    const value = obj[key];
}

Tenemos Object.keys() y Object.values() para obtener todos ahora, pero ninguno de los métodos se relaciona con el valor o la clave principal. Me encanta usarlo Object.entries para mantener esa relación y mantener tanto la clave como el valor:

Object.entries({
    name: "David",
    color: "green",
    balance: 100
}).forEach(([key, value]) => console.log(key, value))

/*
name David
color green
balance 100
*/

Object.entries es un método tan útil cuando necesita tanto una clave como un valor. Tira los viejos for Bucles y sintaxis y uso similar a una matriz Object.entries ¡como un profesional!

  • 9 demostraciones de WebGL alucinantes

    9 demostraciones de WebGL alucinantes

    Por mucho que los desarrolladores detecten Flash ahora, todavía estamos jugando un poco en el bucle para duplicar de forma nativa las funciones de animación que nos brindaba la antigua tecnología de Adobe. Por supuesto que tenemos Canvas, una gran tecnología que destaqué en 9 demostraciones alucinantes. Otra tecnología disponible …

  • Escriba consultas de medios simples, elegantes y fáciles de mantener con Sass
  • Cargar hojas de estilo dinámicamente con MooTools 1.2

    Cargar hojas de estilo dinámicamente con MooTools 1.2

    La temática se ha convertido en una gran parte de la revolución de la Web 2.0. Afortunadamente, también se presta más atención a la semántica y los estándares CSS. Si está creando sus páginas con un buen código XHTML, modificar un archivo CSS puede hacer que su sitio web se vea completamente diferente.

  • Columnas Flexbox con la misma altura

    Columnas Flexbox con la misma altura

    Flexbox debería ser la olla de oro en el largo arcoíris de técnicas de diseño CSS inadecuadas. Y la única decepción que he visto con Flexbox es que los fabricantes de navegadores tardaron tanto en implementarlo. Tampoco puedo afirmar que he superado los límites de Flexbox, pero …


Source link