クールなコンソールもの:簡単なオブジェクト検査


だからここで変なことだ。


The console メソッドtheir own C-like 文字列置換メソッド.

待機、文字列置換?


文字列の一部を文字列の代わりに置き換える.プログラミングランドでは、通常、文字列を補間または書式指定文字列で構築することを意味します.
guest = {name: "Fortesque-Delcourt", calling_gift: "a rather nice sherry"}
console.log( `Sir, Mr ${guest.name} has called. He's bought ${guest.calling_gift}` );

// Output:
"Sir, Mr Fortesque-Delcourt has called.  He's bought a rather nice sherry."

ので、文字列を追加することができますので、何ですか?


コンソールメソッドを使用すると、ユニークな(“C”の形式)を使用できますhttps://developer.mozilla.org/en-US/docs/Web/API/console#outputting_text_to_the_console ]. テンプレートリテラルや文字列の連結を使用できますが、プレースホルダを持つテンプレートを使用して、置換文字列をメソッド引数の一部として渡すこともできます.
console.log(
    "Sir, Mr %s has called. He's bought %s", 
    guest.name, 
    guest.calling_gift
);

// Output:
"Sir, Mr Fortesque-Delcourt has called.  He's bought a rather nice sherry."
リテラル文字列を置き換えることは制限されません.代わりに、テンプレートエンジンは、渡されたオブジェクトをプレースホルダで指定されたデータ型に変換しようとします.
我々はビクトリア朝紳士の投資損失を表すオブジェクトを持っているとしましょう
let losses = {
    pounds: 150,
    reputation: 45.7,
    body_parts: "Teeth"
        faith: ["The Markets", "New-Fangled Steam"]
}
ここでは、異なるプレースホルダに様々な型を渡すときに何を得るのです.
テンプレート文字列
損失ボディッヒパート2
損失ポンド
損失評判
"失われました:% s "
「ロスト:歯」
「失われます:150」
「ロスト:45.7」
"失われました:% i "
「ロストナン」
「失われます:150」
「ロスト45
"失われました:% f "
「ロストナン」
「失われます:150」
「ロスト:45.7」

これは役に立つですか。


いいえ.あなたが整数またはfloatとしてストリングを通過するならば、それは一目で見させます、しかし、...それは世界を救うつもりはない.
便利なのはオブジェクトプレースホルダです.%o and %O .

オブジェクトプレースホルダ


あなたが呼ぶならばconsole.log オブジェクトでは、あなたは驚くほど役に立たないデフォルトtoString 出力:
Assertion failed: [object Object]
これはグロスです.でも!オブジェクトプレースホルダのいずれかを使用する場合は、プロパティとその値の列挙を表す何かを取得します.何かの種類は、演算子に依存し、どのようなコンソールを使用している.

ノード。JS CLI


CLIから、呼び出しconsole.log 大文字で%O 演算子はインライン列挙を生成します.
小文字の使用%o 複数行の列挙を生成します.

インライン


console.log("%O", losses)

//Output:
{ pounds: 150, reputation: 45.7, body_parts: 'Teeth', Faith: ['The Markets', 'New-Fangled Steam'] }

マルチライン(% o )


console.log("%o", losses)

//Output:
{
  pounds: 150,
  reputation: 45.7,
  body_parts: 'Teeth',
  Faith: ['The Markets', 'New Fangled Steam', [length]: 2]
}

ブラウザコンソール


クロムコンソールでは、物事は後方にソートする.ここで、小文字"% o "演算子は= inline =列挙を返します.

インライン


console.log("%o", losses)

// Output:
> { pounds: 150, reputation: 45.7, body_parts: 'Teeth', Faith: ['The Markets', 'New-Fangled Steam'] }

オブジェクトのリンク


しかしながら、クールな部分は%O . 大文字形式を使用すると、出力文字列はオブジェクトの名前だけを含みます.これは、警部にあなたの周りを突くように取るクリック可能です!
さあ、言いましょうlosses objectはLosses クラス、そしていくつかの並べ替えも含まれますhistory オブジェクト.オブジェクトの内部に簡単にアクセスできるような、豊富な読み込み可能なデバッグメッセージを作成することができます.
console.log(
    "Your %O exceed %d pounds. See %o.", 
    losses,
    losses.pounds,
    losses.history
)

//Output:
Your >Losses exceed 150 pounds. See >History.

包む


それはコンソール文字列置換のパワーです!簡潔で豊かな情報コンソールメッセージのための簡単なフォーマット.
あなたがこれが好きならば、ドーパミンを打ってください❤️) スイッチ🦄) 左側には、JSコンソールのデバッグシリーズの次のエントリのための私の書き込みを購読する!

認識


ヘッダーイメージは@https://unsplash.com/@sigmund ], Unsplashライセンスの下で使用されます.