オブジェクトの中身を確認する

オブジェクトをコンソールで確認する。

console.log(obj)

JSON 形式の文字列として出力する。

console.log(JSON.stringify(obj))

参考:

JavaScript でオブジェクトの内容が知りたい時 – Qiita

javascript のデバッグで object の中身を文字列として展開する方法 | infoScoop 開発者ブログ

jQuery や JavaScript で var_dump() したいときは、console.log(hoge) して Chrome のコンソールでみればいいらしい | なかちょんブログ

object – What is the JavaScript equivalent of var_dump or print_r in PHP? – Stack Overflow

Console API

参考:

console.log だけじゃない!Console API のメソッドまとめ | あるいてっく

console.error

参考:

Javascript で簡単にスタックトレースを出力する (Chrome 限定) – Qiita

console.trace

参考:

JavaScript で関数が何処から呼ばれたか調べる方法 | 風の吹く丘

スタックトレース | MDN

Console.trace() | MDN

Chrome Developer Tools で関数の戻り値を確認する

参考:

How to inspect JavaScript function return value in Chrome debugger? – Stack Overflow

util.inspect

参考:

Node.js でオブジェクトの中身を全て表示する | Wokashi

Chrome Developer Tools

参考:

Chrome で javascript デバッグ!まず半歩 | SlideShare

ソースマップ

参考:

ソースマップを使用する | MDN

An Introduction to Source Maps | Treehouse Blog

SyntaxError: Using //@ to indicate sourceURL pragmas is deprecated. Use //# instead – JavaScript | MDN

Coverage

参考:

Chrome バージョン59のデベロッパーツールに CSS、JS のカバレッジタブが追加されるらしい – Qiita

Chrome で計測可能になった CSS カバレッジについての調査検証を行ったお話 | GMO メディア エンジニアブログ

Google Chrome v59 の DevTools がすごい | すなばいじり

How to check Code Coverage in Chrome | DEV Community

Measuring Javascript and CSS coverage with Google Chrome Developer Tools | Vojtech Ruzicka’s Programming Blog

The CSS Tracker Panel | Umar Hansa

Eruda

参考:

Eruda – Console for Mobile Browsers [Official]

liriliri/eruda: Console for mobile browsers – GitHub

undefined is not a function

undefined になっている関数 (もしくは変数) を関数として呼び出そうとした場合に起こるエラー。

参考:

undefined is not a function | DRY な備忘録

関数の場合の変数の巻き上げ問題について – Qiita

js 久々に触ったら undefined is not a function 出た件 | くわこの permission denied.

TypeError: undefined is not a function – スタック・オーバーフロー

まとめ

参考:

Debugging Tips and Tricks | CSS-Tricks

Logging Errors in Client-Side Applications | SitePoint

Tips

参考:

Chrome Devtools の知っていると便利な機能まとめ | noah.plus

Web 制作者は使わないと損!Chrome 59 でアップデートされたデベロッパーツールの便利な新機能 | コリス

タグ:

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です