J'ai essayé d'utiliser console.log pour pouvoir voir le contenu de mon tableau qui contient plusieurs objets. Cependant, je reçois une erreur disant que console.log n'est pas un objet, etc. J'utilise jquery 1.6.2 et mon tableau est comme ceci:

filters = {dvals:[{'brand':'1', 'count':'1'},
                  {'brand':'2', 'count':'2'}, 
                  {'brand':'3', 'count':'3'}]}

console.log(filters);

Ce que je veux faire, c'est écrire le contenu de array(filters) dans une boîte d'alerte (c'est ce que je pensais que console.log a fait) au format des filtres. Comment je fais ça?

44
ONYX 27 oct. 2011 à 10:56

7 réponses

Meilleure réponse

console.log ne produit aucune boîte de message. Je ne pense pas qu'il soit disponible dans n'importe quelle version d'IE (ni Firefox) sans l'ajout de Firebug ou quelque équivalent.

Il est cependant disponible dans Safari et Chrome. Puisque vous mentionnez Chrome, je vais l'utiliser pour mon exemple.

Vous devrez ouvrir votre fenêtre et son équivalent de fenêtre de développeur. vous pouvez le faire en cliquant avec le bouton droit sur n'importe quel élément de la page et en sélectionnant "Inspecter l'élément". votre fenêtre sera divisée en deux parties, la partie développeur étant la partie inférieure. dans la division entre les deux parties se trouve une barre avec des boutons et le bouton le plus à droite est étiqueté "console". Vous devrez cliquer dessus pour passer à l'onglet console. Appuyez sur F12 pour les outils de développement dans la plupart des navigateurs sous Windows, commande + Maj + I sur macOS.

Une fois sur place, vous pourrez interagir avec n'importe quelle page chargée en haut via javascript depuis cette console, et tous les messages que vous console.log y seront affichés.

8
Kris 24 oct. 2019 à 11:50

Json signifie JavaScript Object Notation vraiment tous les json sont des objets javascript donc votre tableau est déjà sous forme json. Pour l'écrire dans un div, vous pourriez faire un tas de choses, l'une des plus faciles, je pense, serait:

 objectDiv.innerHTML = filter;

Où objectDiv est le div que vous souhaitez sélectionner dans le DOM à l'aide de jquery. Si vous souhaitez répertorier des parties du tableau, vous pouvez y accéder car il s'agit d'un objet javascript comme ceci:

 objectDiv.innerHTML = filter.dvals.valueToDisplay; //brand or count depending.

Edit: tout ce que vous voulez être une chaîne mais qui ne l'est pas actuellement (ce qui est rare, javascript traite presque tout comme une chaîne) utilisez simplement la fonction toString() intégrée. }

Deuxième édition pour clarifier: cette réponse est en réponse aux commentaires du PO et pas complètement à sa question d'origine.

1
Ryan 27 oct. 2011 à 08:18

Il semble que Firebug ou le débogueur que vous utilisez ne soit pas correctement initialisé. Êtes-vous sûr que Firebug est complètement initialisé lorsque vous essayez d'accéder à la méthode console.log () -? Vérifiez l'onglet console (s'il est activé).

Une autre possibilité pourrait être que vous écrasiez vous-même l'objet console n'importe où dans le code.

1
Neq 27 oct. 2011 à 06:59

Je recommande vivement cet extrait de code pour garantir que les morceaux de code laissés accidentellement n'échouent pas sur les navigateurs des clients:

/* neutralize absence of firebug */
if ((typeof console) !== 'object' || (typeof console.info) !== 'function') {
    window.console = {};
    window.console.info = window.console.log = window.console.warn = function(msg) {};
    window.console.trace = window.console.error = window.console.assert = function(msg) {};
}

Plutôt que de définir une fonction vide, cet extrait est également un bon point de départ pour faire rouler votre propre console de substitution si nécessaire, c'est-à-dire vider ces informations dans un conteneur .debug, afficher des alertes (pourrait en avoir beaucoup) ou autre ...

Si vous utilisez firefox + firebug, console.dir() est préférable pour vider la sortie du tableau, voir ici.

1
Frank Nocke 4 juil. 2013 à 11:46

L'objet console est disponible dans Internet Explorer 8 ou une version plus récente, mais uniquement si vous ouvrez la fenêtre des outils de développement en appuyant sur F12 ou via le menu.

Il reste disponible même si vous fermez à nouveau la fenêtre des outils de développement jusqu'à ce que vous fermiez votre IE.

Chrome et Opera ont toujours un console disponible, au moins dans les versions actuelles. Firefox a un console lors de l'utilisation de Firebug, mais il peut également en fournir un sans Firebug.

Dans tous les cas, c'est une approche de sauvegarde pour rendre l'utilisation de la sortie console facultative. Voici quelques exemples sur la façon de procéder:

if (console) {
    console.log('Hello World!');
}

if (console) console.debug('value of someVar: ' + someVar);
3
suknic 27 oct. 2011 à 08:44

Il existe deux solutions simples pour vider un tableau sous forme de chaîne. Selon l'environnement que vous utilisez:

… Avec les navigateurs modernes, utilisez JSON:

JSON.stringify(filters);
// returns this
"{"dvals":[{"brand":"1","count":"1"},{"brand":"2","count":"2"},{"brand":"3","count":"3"}]}"

… Avec quelque chose comme node.js, vous pouvez utiliser console.info ()

console.info(filters);
// will output:
{ dvals: 
[ { brand: '1', count: '1' },
  { brand: '2', count: '2' },
  { brand: '3', count: '3' } ] }

Modifier:

JSON.stringify est livré avec deux autres paramètres facultatifs. Le troisième paramètre "espaces" permet une jolie impression:

JSON.stringify(
                obj,      // the object to stringify
                replacer, // a function or array transforming the result
                spaces    // prettyprint indentation spaces
              )

Exemple:

JSON.stringify(filters, null, "  ");
// returns this
"{
 "dvals": [
  {
   "brand": "1",
   "count": "1"
  },
  {
   "brand": "2",
   "count": "2"
  },
  {
   "brand": "3",
   "count": "3"
  }
 ]
}"
55
auco 20 août 2015 à 22:43

Il est simple d'imprimer un objet à consoler en Javascript. Utilisez simplement la syntaxe suivante:

console.log( object );

Ou

console.log('object: %O', object );

Une méthode relativement inconnue suit qui imprime un objet ou un tableau sur la console en tant que table:

console.table (objet);

Je pense qu'il est important de dire que ce type de déclaration de journalisation ne fonctionne que dans un environnement de navigateur. Je l'ai utilisé avec Google Chrome. Vous pouvez regarder la sortie de vos appels console.log dans la Developer Console: ouvrez-la en cliquant avec le bouton droit sur n'importe quel élément de la page Web et sélectionnez «Inspecter». Sélectionnez l'onglet 'Console'.

6
Torsten Barthel 5 mars 2020 à 13:47
7912576