Ir al contenido principal

JavaScript: Conjuntos de datos, u Objetos planos

Objeto plano

Conjuntos de datos

Un conjunto de datos se define como:
    {} ;
Los datos se los insertamos mediante mencionarlo, y de por medio un punto mencionar el dat que agregamos al conjunto.
    {}.datoNuevo = 34 ;
    {}["datoOtro"] = 55 ;
Pero el problema es que {} crea un objeto distinto. Es decir, es lo mismo...
    {} ;
que
    new Object() ;
Entonces si queremos trabajar con un mismo conjunto deberemos ponerle nombre a través de una variable que lo referencie en memoria. Ejemplo:
    var miConjunto = {} ;
    var otroConjunto = {} ;
Ahora, a cada conjunto le iremos agregando datos nuevos con el método anteriormente mencionado.
    miConjunto.datoNuevo = 34 ;
    miConjunto.otroDato = 55 ;
    otroConjunto.suDatoNuevo = 56 ;
Para saber qué contiene en el momento dado conjunto deberemos realizar un console.log()...
    console.log( miConjunto ) ;
Esto nos dará en la consola algo como...
{
    "datoNuevo": 34
    , "otroDato": 55
}
Si luego agregamos un dato más al conjunto realizar el console.log() lo mostrará actualizado:
    miConjunto.masDatos = 88 ;
    console.log( miConjunto ) ;
La consola nos dirá...
{
    "datoNuevo": 34
    , "otroDato": 55
    , "masDatos": 88
}

Formas de inicializarse un conjunto

Una opción es de una agregarle datos desde el comienzo, poniéndole nombre a una variable que controle al conjunto nuevo. Ejemplo:
    var fichaUsuario = {
        "nombre": "Mario"
        , "color": "red
    } ;

Copiar un conjunto

Para copiar un conjunto no se puede igualar a una variable nueva, porque estaremos creando un alias para el conjunto. Es decir, será otra forma de controlar a un mismo conjunto.
    var aliasMiConjunto = miConjunto ;
    console.log( "Mostrando el aliasMiConjunto" ) ;
    console.log( aliasMiConjunto ) ; // Mostrará lo mismo que mi conjunto...
    console.log( "Agregando dato nuevo al alias. Deberá modificar al original" ) ;
    aliasMiConjunto.agregoDato = 12 ;
    console.log( "Mostrando el original" ) ;
    console.log( miConjunto ) ;
Nos generará en la consola...
    Mostrando el aliasMiConjunto
    {
        "datoNuevo": 34
        , "otroDato": 55
        , "masDatos": 88
    }
    Agregando dato nuevo al alias. Deberá modificar el original
    {
        "datoNuevo": 34
        , "otroDato": 55
        , "masDatos": 88
        , "agregadoDato": 12
    }
    
Entonces crear una variable igualándola a un conjunto ya existente no crea un nuevo conjunto con los datos del conjunto mencionado, como lo podríamos hacer cuando igualamos variables que indican números, frases o booleans. Para duplicar un conjunto como copia del original deberemos iterar cada elemento del original e implantárselo al nuevo (ver método de agregar dato en el segundo script de este documento).
    var copiaDeConjuntoOriginal = {} ;
    // Iterando uno por uno cada dato del conjunto original
    for( var cadaDato in miConjunto ) {
        copiaDeConjuntoOriginal[ cadaDato ] = miConjunto[ cadaDato ] ;
    }
    console.log( "Mostrando a la copia" ) ;
    console.log( copiaDeConjuntoOriginal ) ;
    console.log( "Agregando un dato nuevo al conjunto original" ) ;
    miConjunto.otroDatoMas = 33 ;
    console.log( "Mostrando el conjunto original" ) ;
    console.log( miConjunto ) ;
    console.log( "Mostrando el conjunto copia con el dato extra" ) ;
    console.log( copiaDeConjuntoOriginal ) ;
La consola nos dirá...
    Mostrando la copia
    {
        "datoNuevo": 34
        , "otroDato": 55
        , "masDatos": 88
        , "agregadoDato": 12
    }
    Agregando un dato nuevo al conjunto original
    Mostrando el conjunto original
    {
        "datoNuevo": 34
        , "otroDato": 55
        , "masDatos": 88
        , "agregadoDato": 12
    }
    Mostrando el conjunto copia con el dato extra
    {
        "datoNuevo": 34
        , "otroDato": 55
        , "masDatos": 88
        , "agregadoDato": 12
        , "otroDatoMas: 33
    }

Comentarios

Entradas más populares de este blog

Tablero para crear juegos

Tablero SVG - Aplicación del While  Crear un archivo nuevo de HTML con el siguiente código: < style > * { box-sizing : border-box ; font-family : Segoe UI Light, "Ubuntu" ; } svg { margin : auto ; display : block ; } rect { transition : 300 ms all ; } rect :hover { } #juego { background : url ( paisaje.svg ) center center ; background-size : cover ; } body { } </ style > < svg id = " juego " > < / svg > < script > var generarRect = function ( id, origen, medidas, colores ) { var r = "<rect " ; r + = "id='" + id + "' " ; r + = "x='" + (origen.x | | origen[ 0 ]) + "' " ; r + = "y='" + (origen.y | | origen[ 1 ]) + "' " ; r + = "width='" +...

Agregar degradados como fondos

Agregar degradados mediante CSS Degradado lineal y degradado radial o elíptico. Degradado lineal La expresión inglesa para indicar linealidad es  linear . .deg-lineal-1 { /* Degradado vertical */ background-image : linear-gradient ( red, black ) ; } .deg-lineal-2 { /* Degradado según un ángulo decimal */ background-image : linear-gradient ( 45deg , red, black ) ; } .deg-lineal-3 { /* Degradado con transparencia */ background-image : linear-gradient ( 45deg , black, rgba ( 0 , 0 , 0 , . 4 ) ) ; } .deg-lineal-4 { /* Degradado con varios puntos de colores */ background-image : linear-gradient ( 45deg , red, blue, black ) ; } Degradado elíptico o circular La expresión inglesa para indicar radialidad es  radial . .deg-eliptico-1 { /* Degradado elíptico, se adapta a la proporción del DIV */ background-image : radial-gradient ( red, blue...