Почему console.table() не работает для всех объектов/массивов?

Почему console.table() не работает для всех объектов/массивов?

С некоторыми данными я получаю красиво отформатированную таблицу в консоли разработчика. С другими данными я ничего не получаю... даже сообщение об ошибке.

Я только что узнал о console.table(), когда проходил испытания # Javascript30. Докладчик использовал console.table() для некоторых выходных данных, но не для всех, и он не объяснил, почему. Я попытался использовать его для всех выходных данных (массива или объекта) и понял, почему... он не работает.

Вот пример того, что не работает.

const data = ['car', 'car', 'truck', 'truck', 'bike', 'walk', 'car', 'van', 'bike', 'walk', 'car', 'van', 'car', 'truck' ];

const transportation = data.reduce((counters, item) => {
  if (!counters[item]) counters[item] = 0;
  counters[item]++;
  return counters;
}, {});
console.log('transportation table');
console.table(transportation);

console.log('transportation log');
console.log(transportation);
<h1>Look at the console!</h1>

Ответ 1

В настоящее время я работаю над тем же упражнением для JS30 и столкнулся с той же проблемой, что и вы, что привело меня сюда.

Я просмотрел страницу console.table() в MDN, и после некоторого тестирования выяснилось, что это может быть проблемой Chrome.

Из моего ограниченного тестирования кажется, что Chrome не выводит таблицу для коллекций примитивных типов (массив строк, отдельный объект), только коллекции составных типов (массив массивов/объектов, объект, свойства которого являются объектами).

Это не работает:

console.table(['1','2','3']);

Но это делает:

console.table([['1','2','3']]);

Я также тестировал на Канарских островах, но получил те же результаты.

Однако в Firefox console.table() работает правильно. Примеры MDN коллекций примитивных типов работали в Firefox, но не в Chrome.

Чтобы получить вывод для Chrome для вашего примера, вы можете поместить переменную транспорта в свой собственный массив, чтобы Chrome печатал таблицу.

console.table([transportation]);

Ответ 2

В теории console.table() печатает таблицы (2 измерения), а не массивы (1 размер), поэтому внешний массив представляет собой список строк (например, <tr> s), и каждый внутренний массив содержит значения для каждого столбца для этого строка (например, <td> s).

Ответ 3

Я столкнулся с той же проблемой в массиве cardio (wesbos JS30). Я немного поиграл с console.table(что-то), и следующие шаги помогли мне.

  • Запустите программу с помощью f1 (любой ключ для вас я использую визуальный код студии).
  • Проверьте консоль, если она работает хорошо и хорошо.
  • Если он не работает, обновите текущую страницу и проверьте свою консоль сейчас.

Я понятия не имею, как это работает, но это сработало для меня. Я рад, если это поможет вам, и если вы найдете какое-то эффективное решение, не стесняйтесь редактировать это сообщение

Ответ 4

Просто откройте новую вкладку и откройте консоль и введите console.table([['1', '2', '3']]); и запустите его, а затем попробуйте запустить файл и посмотреть, работает ли он или нет. но для меня это сработало!