Comment ajouter un objet à un tableau


317

Comment puis-je ajouter un objet à un tableau (en javascript ou jquery)? Par exemple, quel est le problème avec ce code?

function(){
    var a = new array();
    var b = new object();
    a[0]=b;
}

Je voudrais utiliser ce code pour enregistrer de nombreux objets dans le tableau de function1 et appeler function2 pour utiliser l'objet dans le tableau.

  1. Comment puis-je enregistrer un objet dans un tableau?
  2. Comment puis-je placer un objet dans un tableau et l'enregistrer dans une variable?

12
Veuillez ne pas corriger les erreurs dans le code publié, comme l'a fait l'édition 5. Si vous corrigez une simple erreur dans la question, il n'y a souvent aucune raison pour que la réponse existe.
Paul

En outre, pusha déjà été suggéré plusieurs fois ici. S'il vous plaît, ne polluez plus ce fil avec une autre pushsuggestion.
Boghyon Hoffmann

Réponses:


631

Mettez n'importe quoi dans un tableau en utilisant Array.push ().

var a=[], b={};
a.push(b);    
// a[0] === b;

Informations supplémentaires sur les tableaux

Ajouter plusieurs éléments à la fois

var x = ['a'];
x.push('b', 'c');
// x = ['a', 'b', 'c']

Ajouter des éléments au début d'un tableau

var x = ['c', 'd'];
x.unshift('a', 'b');
// x = ['a', 'b', 'c', 'd']

Ajouter le contenu d'un tableau à un autre

var x = ['a', 'b', 'c'];
var y = ['d', 'e', 'f'];
x.push.apply(x, y);
// x = ['a', 'b', 'c', 'd', 'e', 'f']
// y = ['d', 'e', 'f']  (remains unchanged)

Créer un nouveau tableau à partir du contenu de deux tableaux

var x = ['a', 'b', 'c'];
var y = ['d', 'e', 'f'];
var z = x.concat(y);
// x = ['a', 'b', 'c']  (remains unchanged)
// y = ['d', 'e', 'f']  (remains unchanged)
// z = ['a', 'b', 'c', 'd', 'e', 'f']

J'ai également une question: myArray = []; myArray.push ({'text': 'some text', 'id': 13}); et maintenant myArray est vide. Donc, si nous essayons d'obtenir la valeur de myArray [0] ['text'], elle sera vide, pourquoi? take.ms/jSvbn
fdrv

Quelque chose ne semble pas correct. Assurez-vous qu'il n'y a pas de problème de portée. Utilisez let / var pour déclarer myArray. Parce que myArray.push mute toujours myArray.
John Strickler

58
var years = [];
for (i= 2015;i<=2030;i=i+1)
{
years.push({operator : i})
}

ici les années de tableau a des valeurs comme

years[0]={operator:2015}
years[1]={operator:2016}

ça continue comme ça.


55

Tout d'abord, il n'y a pas de objectou array. Il y a Objectet Array. Deuxièmement, vous pouvez le faire:

a = new Array();
b = new Object();
a[0] = b;

Maintenant, asera un tableau avec bcomme seul élément.


4
+1 pour la réponse la moins compliquée. Je l'ai développé ci-dessous pour inclure une réponse à la question 2 de l'OP.
Sam

30

En utilisant la ES6notation, vous pouvez faire quelque chose comme ceci:

Pour l'ajout, vous pouvez utiliser l' opérateur d'étalement comme ceci:

var arr1 = [1,2,3]
var obj = 4
var newData = [...arr1, obj] // [1,2,3,4]
console.log(newData);


20
  • JavaScript est sensible à la casse . Appelant new array()et new object()lancera un ReferenceErrorcar ils n'existent pas.
  • Il vaut mieux éviter en new Array()raison de son comportement sujet aux erreurs .
    Attribuez plutôt le nouveau tableau avec = [val1, val2, val_n]. Pour les objets, utilisez = {}.
  • Il existe de nombreuses façons d'étendre un tableau (comme indiqué dans la réponse de John ), mais le moyen le plus sûr serait simplement d'utiliser à la concatplace de push. concatrenvoie un nouveau tableau, laissant le tableau d'origine intact. pushmute le tableau appelant qui doit être évité , surtout si le tableau est défini globalement.
  • C'est également une bonne pratique de geler l'objet ainsi que le nouveau tableau afin d'éviter des mutations involontaires. Un objet figé n'est ni modifiable ni extensible (superficiellement).

En appliquant ces points et pour répondre à vos deux questions, vous pouvez définir une fonction comme celle-ci:

function appendObjTo(thatArray, newObj) {
  const frozenObj = Object.freeze(newObj);
  return Object.freeze(thatArray.concat(frozenObj));
}

Usage:

// Given
const myArray = ["A", "B"];
// "save it to a variable"
const newArray = appendObjTo(myArray, {hello: "world!"});
// returns: ["A", "B", {hello: "world!"}]. myArray did not change.

2
"Utilisation" est ce qui en a fait ma réponse préférée.
HPWD du

@boghyon, je suis curieux du gel et des mutations. Parlez-vous de modifications du tableau qui pourraient se produire directement en raison de la méthode concat, ou en raison de modifications qui pourraient être apportées au tableau ailleurs dans le script pendant le processus d'exécution d'un '.concat ()'? Dans le second cas, cela ne devrait-il pas être automatiquement empêché en raison du fait que le javascript est monothread, même dans le cas de code asynchrone, car le contrôle ne devrait pas, au moins théoriquement, être renvoyé tant que la méthode n'est pas terminée?
jdmayfield

@jdmayfield: La stratégie d'évaluation de JS repose sur le partage d'objets . Lorsque des objets sont contournés, ils ne sont pas copiés. Les mutations de ces objets, tout en étant transmises, sont toujours immédiatement visibles pour les appelants, que le mutateur ait été appelé de manière asynchrone, terminé ou non. Étant donné que ces effets secondaires ont souvent conduit à des bugs, nous retournons un nouvel objet, découplé de l'original. Rendre les objets immuables (par exemple via freeze) n'est qu'une étape supplémentaire pour empêcher les mutations involontaires.
Boghyon Hoffmann

@jdmayfield: Mais comme vous l'avez peut-être déjà deviné, la création de nouveaux objets à chaque fois peut devenir rapidement inefficace lorsque les objets deviennent énormes. Pour de tels cas, il existe des bibliothèques utiles, qui le rendent efficace en exploitant des structures de données persistantes, telles que Mori (un peu mort) et Immutable.js . Voici une brève introduction à "pourquoi l'immuabilité": youtu.be/e-5obm1G_FY
Boghyon Hoffmann

9

Extension de la réponse de Gabi Purcaru pour inclure une réponse au numéro 2.

a = new Array();
b = new Object();
a[0] = b;

var c = a[0]; // c is now the object we inserted into a...

8

/* array literal */
var aData = [];

/* object constructur */
function Data(firstname, lastname) {
  this.firstname = firstname;
  this.lastname = lastname;
  this.fullname = function() {
    return (this.firstname + " " + this.lastname);
  };
}

/* store object into array */
aData[aData.length] = new Data("Java", "Script"); // aData[0]

aData.push(new Data("Jhon", "Doe"));
aData.push(new Data("Anna", "Smith"));
aData.push(new Data("Black", "Pearl"));

aData[aData.length] = new Data("stack", "overflow"); // aData[4]

/* loop arrray */
for (var x in aData) {
  alert(aData[x].fullname());
}

/* convert array of object into string json */
var jsonString = JSON.stringify(aData);
document.write(jsonString);


7

obejctest clairement une faute de frappe. Mais les deux objectet ont arraybesoin de majuscules.

Vous pouvez utiliser des mains courtes pour new Arrayet new Objectce sont []et{}

Vous pouvez pousser des données dans le tableau à l'aide de .push. Cela l'ajoute à la fin du tableau. ou vous pouvez définir un index pour contenir les données.

function saveToArray() {
    var o = {};
    o.foo = 42;
    var arr = [];
    arr.push(o);
    return arr;
}

function other() {
    var arr = saveToArray();
    alert(arr[0]);
}

other();

5

La réponse alternative est la suivante.

si vous avez un tableau comme celui-ci: var contacts = [bob, mary];

et vous voulez mettre un autre tableau dans ce tableau, vous pouvez le faire de cette façon:

Déclarez le constructeur de la fonction

function add (firstName,lastName,email,phoneNumber) {
this.firstName = firstName;
this.lastName = lastName;
this.email = email;
this.phoneNumber = phoneNumber;
}

créer l'objet à partir de la fonction:

var add1 = new add("Alba","Fas","Des@gmail.com","[098] 654365364");

et ajoutez l'objet dans le tableau:

contacts[contacts.length] = add1;

3
a=[];
a.push(['b','c','d','e','f']);

6
Salut, bienvenue à SO. Veuillez ne pas simplement vider le code comme réponse. Expliquez vos pensées afin que les utilisateurs puissent mieux comprendre ce qui se passe. Merci.
Cthulhu

2

La façon dont j'ai créé le créateur d'objets avec la liste automatique:

var list = [];

function saveToArray(x) {
    list.push(x);
};

function newObject () {
    saveToArray(this);
};

0

Vous rencontrez un problème de portée si vous utilisez votre code en tant que tel. Vous devez le déclarer en dehors des fonctions si vous prévoyez de l'utiliser entre elles (ou si vous appelez, passez-le en paramètre).

var a = new Array();
var b = new Object();

function first() {
a.push(b);
// Alternatively, a[a.length] = b
// both methods work fine
}

function second() {
var c = a[0];
}

// code
first();
// more code
second();
// even more code
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.