Почему в консоли браузера иногда выводится response.data: [object Object] а иногда объект выводится подробно, со ссылочками и пр?

Question

[Роми]

Когда приходится отлаживать код в консоли браузера, то ответы сервера иногда отображаются как

[object Object]

а иногда эти же объекты, подробно выводятся в виде данных и гиперссылок, можно посмотреть что внутри и пр.

Я не ухватил закономерность, от чего это зависит? Знает кто-нибудь?

Заранее спасибо!

Comments

[Lynn «Кофеман»]

В первом случае ты его зачем-то сложил со строкой

Answer 1

[4ch23]

Здесь выводится объект:

console.log({})
{}

А здесь объект, преобразованный в строку

console.log({a:5}.toString())
[object Object]

Comments

[Роми]

да, спасибо, я уже просек в чем фишка, я ему когда пишу: console.log('response.data: ' + response.data); - он все в строку автоматом преобразовывает.

[Роми]

...т.е. просто console.log(response.data); оно показывает как надо :)

спасибо за участие!)

[Роман]

Роми, пиши через запятую))))

console.log('response.data:', response.data);

[Роми]

Роман, я щас как девочка из того анека:

- А что, так можно было что ли??...

)))))))))

Спасибо!

Answer 2

[kryamk]

console.dir() можно ещё использовать

Comments

[Роми]

кстати, да) щас попробовал - в FF работает хорошо (Эта возможность не является стандартной и стандартизировать её пока никто не собирается. Не используйте её на сайтах, смотрящих во внешний мир: она будет работать не у всех пользователей. Также могут присутствовать большие несовместимости между реализациями и её поведение может в будущем измениться.) - это с мозиллы-сайта.

Спасибо!

Answer 3

[Роми]

В общем, нашел я закономерность:

вот это

console.log('response.data: ' + response.data);

он выводит как:

response.data: [object Object]

зато, вот это:

console.log(response.data);

он выводит красивенько :D со всеми свойствами объекта data.

И еще нагуглил трюк:

console.log('response.data: ' + JSON.stringify(response.data));

выведет не так красивенько)) но тоже вполне информативно.

ура! :)

upd. дополнение от Роман

console.log('response.data:', response.data);

тоже круто))

и от kryamk

console.dir()

у нас сегодня праздник отладки!!! )))

Comments

[Aetae]

Там ещё много всяких трюков, например можно делать так:

console.log('%cresponse.data: %o!', 'color: #f00', response.data)

Ну и обычно я фигачу в таком духе console.log({data, someMore}) - чтоб лишний раз имя переменной не писать.)

[Роми]

Aetae, вау!!))) Спасибо!

[Роми]

Aetae, у вас в первом аргументе какая-то опечатка, да? или нет? я просто не могу понять))

[Aetae]

Роми,
%c - стиль
%o - объект

%x - комманды последовательно применяются к последующим аргуметам console.log.

[Роми]

Aetae, афигеть!))) А где эти сакральные знания есть? Я вроде доку на Мозилле смотрел - ничего такого не увидел))

[Aetae]

Роми, там всё есть: mdn