あなたが知らないconsone.log()
3396 ワード
consolie.logsは、開発者として毎日使っていると思いますが、この簡単な関数の裏には知らないところがあります.多くの人が使ったことがないです.いくつかあっても使いやすいです.
基礎
まず、簡単な科学普及という関数の役割.フロントエンドの開発者は、jsコードの任意の部分でconsolie.logsを呼び出すことができます.ブラウザの開発者コンソールで、この関数が呼び出された瞬間に指定された変数や表現の値を見ることができます.
プレースホルダ
説明
%s
文字列
%d%i
整数
%f
浮動小数点
%o/%O
オブジェクト
%c
cssスタイル
よく使われているものは言いません.言ってください.あまり使わないものです.
consolie.log/debug/warn/error、これらはデバッグ出力ができます.違いは:
タイプが違っています.私たちは調節器の底から異なる出力項目を選別できます.
だからウェブサイトの再構成要求と同じように、私達のデバッグ出力が多い時、実際のシーンによって違うタイプの出力関数を使うと、私達の出力がもっと合理的になります.
これを使って出力します.エラー情報を出力するほか、この関数を呼び出した瞬間のコールスタックも出力できます.これは間違いなく私達のデバッグに多くの便利をもたらします.(もちろん、あなたもjsを使って断続的に一歩ずつ追跡してもいいです.)これはconsolie.logsにはないものです.consone.errorの他に、呼び出しの瞬間的な呼び出しスタックをプリントアウトする機能もありますが、その出力パターンと位置はconsone.logと同じです.
実はデバッグの情報を印刷する以外に、consoneはあります多くの強大で役に立ちますが、とても控えめなインターフェースです.
consone.time&consolie.timeEnd
これは性能デバッグの利器です.NodeJsに詳しい子供用の靴はもっとはっきりしています.多くの子供靴がやったことがあります.私たちのコードの前にstartTimeのような変数が追加されました.タイムスタンプを与えて、コードを実行した後、タイムスタンプを押してから、両方を減らして、結果を出力します.上の関数を使うと、手間が省けます.
consolie.com unt
これはカウンタです.aのように名前を伝えてください.その後は毎回consolie.com(a)を呼び出します.(関数が違うところでも大丈夫です.)このような呼び出しは何回実行されますか?
consone.astert
asertさん、プログラミングをするのはこの単語に慣れないはずです.断言します.コンサート・ソロ・クラスを使って、禁じられた技として理解できます.この表現の真偽を間違えたら、私はメッセージを打つことができます.
ソロ・グループ
見ればグループ出力と分かります.
consolie.clear
最後の最後は清算するべきです.
特に適用されます.複数の人が開発したプロジェクトでは、他の人のデバッグ出力に不満があります.この関数を使ってすべてクリアして、自分のデバッグ情報を出力してもいいです.この関数に遠慮しないでください.
締め括りをつける
王大槌です.まさか、consolie.logの八卦はこのように私に言い切られました.何万字の水を吹くことができると思っていました.
conssole.timestamp&consolie.profileの2つの関数が付いています.chromeデバッグパネルの2つのtabに対応しています.デバッグ性能は使えます.興味のある子供靴は見てもいいです.Google開発者ドキュメントのconsolie.
基礎
まず、簡単な科学普及という関数の役割.フロントエンドの開発者は、jsコードの任意の部分でconsolie.logsを呼び出すことができます.ブラウザの開発者コンソールで、この関数が呼び出された瞬間に指定された変数や表現の値を見ることができます.
console.log('123');
// 123
console.log('1', '2', '3');
// 1 2 3
console.log('1
2
3
');
// 1
// 2
// 3
上記のように単一の変数(式)、複数の変数、および改行出力を行うことができます.これは日常開発の多くの状況にとって十分です.フォーマット出力console.log('%d + %d = %d', 1, 1, 2);// console.log(1,1,2);
// 1 + 1 = 2
C言語を書いた子供用の靴は必ずこのような書き方に慣れていません.このような書き方は複雑な出力の時、テンプレートとデータの分離を保証できます.構造がもっとはっきりしています.簡単な輸出は不便です.consolie.logでサポートされているフォーマットのロゴは以下の通りです.プレースホルダ
説明
%s
文字列
%d%i
整数
%f
浮動小数点
%o/%O
オブジェクト
%c
cssスタイル
よく使われているものは言いません.言ってください.あまり使わないものです.
consolie.log/debug/warn/error、これらはデバッグ出力ができます.違いは:
タイプが違っています.私たちは調節器の底から異なる出力項目を選別できます.
だからウェブサイトの再構成要求と同じように、私達のデバッグ出力が多い時、実際のシーンによって違うタイプの出力関数を使うと、私達の出力がもっと合理的になります.
これを使って出力します.エラー情報を出力するほか、この関数を呼び出した瞬間のコールスタックも出力できます.これは間違いなく私達のデバッグに多くの便利をもたらします.(もちろん、あなたもjsを使って断続的に一歩ずつ追跡してもいいです.)これはconsolie.logsにはないものです.consone.errorの他に、呼び出しの瞬間的な呼び出しスタックをプリントアウトする機能もありますが、その出力パターンと位置はconsone.logと同じです.
実はデバッグの情報を印刷する以外に、consoneはあります多くの強大で役に立ちますが、とても控えめなインターフェースです.
consone.time&consolie.timeEnd
これは性能デバッグの利器です.NodeJsに詳しい子供用の靴はもっとはっきりしています.多くの子供靴がやったことがあります.私たちのコードの前にstartTimeのような変数が追加されました.タイムスタンプを与えて、コードを実行した後、タイムスタンプを押してから、両方を減らして、結果を出力します.上の関数を使うと、手間が省けます.
console.time('wait');
setTimeOut(()=>{
console.timeEnd('wait');
},1000);
wait: 1000ms
この二つのインターフェースを使うのは何が便利ですか?また,関数パラメータとして一つの文字列を使用して,異なる性能時間計算を区別することもできた.consolie.com unt
これはカウンタです.aのように名前を伝えてください.その後は毎回consolie.com(a)を呼び出します.(関数が違うところでも大丈夫です.)このような呼び出しは何回実行されますか?
let a = ()=>{
console.count('Call function a');
};
let b = ()=>{
a();
}
let c = ()=>{
b();
}
b();
c();
Call function a:1
Call function b:2
この関数は特にいくつかの複雑なシーンに適しています.時には一つの関数が複数の場所で呼び出されることがありますが、私たちはこの関数が少なく呼び出されたかどうか、または繰り返し呼び出されたかどうかを知りたいです.この時はカウンタを使うのはjsの断点自身よりも何回も速くなりました.consone.astert
asertさん、プログラミングをするのはこの単語に慣れないはずです.断言します.コンサート・ソロ・クラスを使って、禁じられた技として理解できます.この表現の真偽を間違えたら、私はメッセージを打つことができます.
let a = ()=>{
let el = document.getElementById('test');
console.assert(el,' ID test ');
}
a();
// Assertion failed: ID test
もちろん、この関数を使って、ある条件に合っているだけでデバッグ出力を行うことができます.出力をもっと綺麗にします.もちろんあなたもif文を使ってもいいですが、書くのはちょっと面倒です.ソロ・グループ
見ればグループ出力と分かります.
console.group('group1');
console.log('a');
console.log('b');
console.groupEnd('group1');
console.group('group2');
console.log('a2');
console.log('b2');
console.groupEnd('group2');
明らかにこの関数は特別に多くのデバッグ出力がある場合に適しています.大きなプロジェクトを作ると、役に立ちます.でも、時々コントロールを開けて、フルスクリーンの出力を見たら、あなたも頭が痛くなります.だから、グループに分けて出力して、デフォルトで閉じることができます.consolie.clear
最後の最後は清算するべきです.
特に適用されます.複数の人が開発したプロジェクトでは、他の人のデバッグ出力に不満があります.この関数を使ってすべてクリアして、自分のデバッグ情報を出力してもいいです.この関数に遠慮しないでください.
締め括りをつける
王大槌です.まさか、consolie.logの八卦はこのように私に言い切られました.何万字の水を吹くことができると思っていました.
conssole.timestamp&consolie.profileの2つの関数が付いています.chromeデバッグパネルの2つのtabに対応しています.デバッグ性能は使えます.興味のある子供靴は見てもいいです.Google開発者ドキュメントのconsolie.