コンソールを介したデバッグのための高度なテクニックの共有

通常、新しい JavaScript コードを作成すると、構文エラーまたは論理エラーが発生することがよくあります。デバッグ ツールがなければ、頭が爆発してしまうと思います。以下の記事ではコンソールを使ってデバッグするための高度なテクニックを主に10個まとめて紹介していますので、お役に立てれば幸いです。

まえがき

過去 10 年にわたり、私の最大の情熱の 1 つはフロントエンド開発 (特に JavaScript) でした。私は「職人」として、さまざまな道具に特化するのが好きです。この記事では、昔ながらのコンソールを使用したデバッグ手法をいくつか紹介します。

はい、私たちは皆、以下の基本的なスキルを知っています:

console.log(‘Hello World!');
console.info(‘Something happened…'); 
console.warn(‘Something strange happened…'); 
console.error(‘Something horrible happened…');

これからは、あなたが知らないスキルをいくつか教えて、経験豊富なドライバーになれるようにします!

1. console.trace()

メッセージが出力される場所を知りたい場合は、console.trace() を使用して、出力されるデータのスタックトレースを取得します。

2. console.time() && console.timeEnd()

関数のパフォーマンスを分析したい場合は、console.time() を使用して時間を測定し、console.timeEnd() を使用して終了します。 the time, console 2 つの時刻間の時差が表示されます。

3. console.memory

パフォーマンスの問題の分析が難しく、メモリ リークがあるかどうかも検討したい場合は、console.memory を使用できます (メモリは関数ではなくコンソールのプロパティ) を使用して、現在のヒープ使用量を表示します。

4. console.profile(‘profileName’) & console.profileEnd(‘profileName’)

これは標準的な手法ではありませんが、広く受け入れられ、使用されています。これら 2 つのコマンドを使用して、プロファイリングを開始および停止できます。これは、コード内で正確なプロファイリングを行うのに役立ちます。手動のマウスクリックに頼るのではなく。ブラウザ コンソールの JavaScript プロファイラでプロファイルを見つけることができます。

5. console.count("STUFF I COUNT")

場合によっては、関数またはコードの一部が繰り返し実行された回数を記録するために、console.count('?' を使用できます)。 ） レコードする。このコードが実行されるたびに、自動的に 1 ずつ増加します。

6. console.assert(false, “Log me!”)

if-else を使用する代わりに、console.assert を使用して特定の false 条件下でメッセージを出力できます。

注: アサーション エラーは Node.js で報告されます。

7. console.group('group') & console.groupEnd('group')

出力されたログをフォーマットしたい場合は、console.group() と console .groupEnd() を使用できます。 。 console.group を使用して、ログをグループに集約し、ネストされた階層を形成します。

例を参照してください:

8. 文字列置換

console.log を使用して変数 (%s = 文字列、%i = 整数、%o = オブジェクト、%f = 浮動小数点) を出力できます。

9. console.clear()

コンソールに大量のレコードを出力しました。それらをクリアするには console.clear() を使用しましょう。

10. console.table()

最後です！ console.table() を使用すると、オブジェクトを表形式で出力できます。

関連する推奨事項:

JavaScript のデバッグに必要な 5 つのデバッグ スキルを共有します

以上がコンソールを介したデバッグのための高度なテクニックの共有の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。