6

Tengo la siguiente lista en javascript:

var nodes = [
      { name: "Skills"},
      { name: "HTML5", target: [0], value: 58 },
      { name: "CSS3", target: [0, 1], value: 65 },  
      { name: "Javascript", target: [0, 1, 2, 8], value: 37 },
      { name: "Scss", target: [0, 1, 2], value: 52 },
      { name: "Compass", target: [0, 3], value: 48 }, 
      { name: "Susy", target: [0,3,4], value: 40 }, 
      { name: "Breakpoints", target: [0,3,4,5], value: 36 },
      { name: "jQuery", target: [0, 1, 2], value: 52 },
      { name: "PHP", target: [0,1,2], value: 20 },
      { name: "Wordpress", target: [0,1,2,3,9], value: 67 },
      { name: "Git", target: [0,1,2,3,4,5,6,7,8,10], value: 68 },
      { name: "Snap.svg", target: [0,1,2,7,8 ], value: 16 },
      { name: "d3", target: [0,1,2,7,8], value: 25 },
      { name: "Gulp", target: [0,1,2,3,4,5,6,7,8,9,10,11,12], value: 45 },
      { name: "Angular", target: [0,1,2,7,8], value: 25 },
      { name: "Adobe CS", target: [0,1,2,12], value: 57 },
      { name: "mySql", target: [0,9,10], value: 20 },
      { name: "Grunt", target: [0,9,10], value: 37 },
];

Deduzco que es una lista de objetos. Me gustaría añadir objetos a esta lista de forma dinámica y me pregunto si hay alguna expresión tipo lista = lista +[nuevo item] o el lista.append('nuevoitem') como en Python. He buscado un poco por google pero no me queda claro el asunto es como si en javascript no existieran las listas de las que estoy acostumbrado en Python.
No tengo mucha experiencia con js y vengo de Python.

3
  • Investiga nodes.push( obj )
    – lois6b
    el 24 abr. 2018 a las 12:09
  • Aquí tienes un link a todos los métodos de Array en javascript (para fines prácticos, en javascript los array son listas dinámicas) w3schools.com/jsref/jsref_obj_array.asp
    – LPZadkiel
    el 24 abr. 2018 a las 12:23
  • Seguramente que te sirva elemento.push(nuevo_item), es decir, nodes.push(nuevo_item)
    – Marcos
    el 24 abr. 2018 a las 12:49

3 respuestas 3

8

Ya tienes un par de respuestas válidas con push. Con ese método vas a insertar elementos al final del array, pero hay otros modos de insertar en un array en JavaScript:

  • push: se inserta al final del array.
  • unshift: se inserta al principio del array.
  • splice: permite insertar (o borrar) elementos en cualquier posición del array.
  • concat: eso permite concatenar arrays, podrías añadir al principio o final concatenando un elemento dentro de otro array (no es ideal, pero funcionaría).
  • usando corchetes []: puedes insertar un elemento especificando su posición, si esa posición no existe, el array aumentará de tamaño automáticamente.

Aquí puedes ver una demo con esos cinco métodos funcionando (voy a usar números para simplificar, pero puedes usar objetos igualmente):

// array inicial con dos elementos
var miArray = [2,4];

// agregamos un elemento al final
miArray.push(5);

// agregamos un elemento al principio
miArray.unshift(1);

// agregamos un elemento al final usando corchetes
miArray[miArray.length] = 6;

// agregamos un elemento al final concatenándolo como un array
miArray = miArray.concat(7);

// agregamos un elemento en mitad (posición 2)
miArray.splice(2,0,3);

// el array resultante será [1,2,3,4,5,6]
console.log(miArray);

1
  • como siempre Alvaro , dando respuestas completas, hasta yo no sabias de eso , gracias por la aclaración. el 25 abr. 2018 a las 12:30
3

Simplemente usa push de esta forma para agregar otro elemento a la lista.

var nodes = [
      { name: "Skills"},
      { name: "HTML5", target: [0], value: 58 },
      { name: "CSS3", target: [0, 1], value: 65 },  
      { name: "Javascript", target: [0, 1, 2, 8], value: 37 },
      { name: "Scss", target: [0, 1, 2], value: 52 },
      { name: "Compass", target: [0, 3], value: 48 }, 
      { name: "Susy", target: [0,3,4], value: 40 }, 
      { name: "Breakpoints", target: [0,3,4,5], value: 36 },
      { name: "jQuery", target: [0, 1, 2], value: 52 },
      { name: "PHP", target: [0,1,2], value: 20 },
      { name: "Wordpress", target: [0,1,2,3,9], value: 67 },
      { name: "Git", target: [0,1,2,3,4,5,6,7,8,10], value: 68 },
      { name: "Snap.svg", target: [0,1,2,7,8 ], value: 16 },
      { name: "d3", target: [0,1,2,7,8], value: 25 },
      { name: "Gulp", target: [0,1,2,3,4,5,6,7,8,9,10,11,12], value: 45 },
      { name: "Angular", target: [0,1,2,7,8], value: 25 },
      { name: "Adobe CS", target: [0,1,2,12], value: 57 },
      { name: "mySql", target: [0,9,10], value: 20 },
      { name: "Grunt", target: [0,9,10], value: 37 },
];

nodes.push({ name: "Agregoalgo", target: [0], value: 2222 },);

console.log(nodes);

3

Los objetos de tipo Array tienen un metodo llamado push con el cual puedes ir añadiendo elementos al mismo.

var nodes = [
      { name: "Skills"},
      { name: "HTML5", target: [0], value: 58 },
      { name: "CSS3", target: [0, 1], value: 65 },  
      { name: "Javascript", target: [0, 1, 2, 8], value: 37 },
      { name: "Scss", target: [0, 1, 2], value: 52 },
      { name: "Compass", target: [0, 3], value: 48 }, 
      { name: "Susy", target: [0,3,4], value: 40 }, 
      { name: "Breakpoints", target: [0,3,4,5], value: 36 },
      { name: "jQuery", target: [0, 1, 2], value: 52 },
      { name: "PHP", target: [0,1,2], value: 20 },
      { name: "Wordpress", target: [0,1,2,3,9], value: 67 },
      { name: "Git", target: [0,1,2,3,4,5,6,7,8,10], value: 68 },
      { name: "Snap.svg", target: [0,1,2,7,8 ], value: 16 },
      { name: "d3", target: [0,1,2,7,8], value: 25 },
      { name: "Gulp", target: [0,1,2,3,4,5,6,7,8,9,10,11,12], value: 45 },
      { name: "Angular", target: [0,1,2,7,8], value: 25 },
      { name: "Adobe CS", target: [0,1,2,12], value: 57 },
      { name: "mySql", target: [0,9,10], value: 20 },
      { name: "Grunt", target: [0,9,10], value: 37 },
];
//Añadiendo un nuevo elemento
nodes.push({ name: "Nuevo elemento", target: [1,2,3], value: 4 });

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.