仕事ですぐに使えるTypeScript その8

目的

学習の記録と学びになった部分をアウトプットするため。

期限

対象書籍の読了・内容理解が8月中に完了していること。

対象

今回の対象は「複合型」。

future-architect.github.io

著作権者:フューチャー株式会社(Future Corporation)様

console.logによる出力

三行サマリ

  • console.logの引数に{} を使用することで変数名と値がペアになって出力される。
  • console.tableでは複雑なオブジェクトを表形式で確認することができる。
  • console.dirでは複雑なオブジェクトをツリー形式で確認することができる。

console.log

何かの変数を出力したい時は、{} で描こうと変数名と値がペアになって出力され、見やすくなる。

const hoge = "fuga";

console.log(hoge);
// > fuga

console.log({hoge});
// > { hoge: 'fuga' }

console.table/dir()

  • 複雑なオブジェクトを console.table() は表形式に、console.dir() はツリー形式で表示することができる。

console.table()

const sample = {
    hoge: "hogeStr",
    fuga: "fugaStr",
    tree1: {
        hoge: "hoge",
        tree2: {
            hoge: "hoge",
            tree3: {
                hoge: "hoge"
            }
        }
    }
}

console.table(sample);

gyazo.com

console.dir(sample)

gyazo.com