【问题标题】:How to show full object in Chrome console?如何在 Chrome 控制台中显示完整对象?
【发布时间】:2011-05-27 20:17:33
【问题描述】:
var functor=function(){
    //test
}

functor.prop=1;

console.log(functor);

这里只显示函子的函数部分,不能在控制台显示函子的属性。

【问题讨论】:

    标签: javascript debugging google-chrome


    【解决方案1】:

    我制作了 Trident D'Gao 答案的函数。

    function print(obj) {
      console.log(JSON.stringify(obj, null, 4));
    }
    

    如何使用

    print(obj);
    

    【讨论】:

      【解决方案2】:

      如果你尝试,你可能会得到更好的结果:

      console.log(JSON.stringify(obj, null, 4));
      

      【讨论】:

      • 这个答案通过格式化输出改进了@BastiBen。
      【解决方案3】:

      在现代浏览器中,console.log(functor) 可以完美运行(行为与 console.dir 相同)。

      【讨论】:

        【解决方案4】:
        var gandalf = {
          "real name": "Gandalf",
          "age (est)": 11000,
          "race": "Maia",
          "haveRetirementPlan": true,
          "aliases": [
            "Greyhame",
            "Stormcrow",
            "Mithrandir",
            "Gandalf the Grey",
            "Gandalf the White"
          ]
        };
        //to console log object, we cannot use console.log("Object gandalf: " + gandalf);
        console.log("Object gandalf: ");
        //this will show object gandalf ONLY in Google Chrome NOT in IE
        console.log(gandalf);
        //this will show object gandalf IN ALL BROWSERS!
        console.log(JSON.stringify(gandalf));
        //this will show object gandalf IN ALL BROWSERS! with beautiful indent
        console.log(JSON.stringify(gandalf, null, 4));
        

        【讨论】:

          【解决方案5】:

          我写了一个函数来方便地将东西打印到控制台。

          // function for debugging stuff
          function print(...x) {
              console.log(JSON.stringify(x,null,4));
          }
          
          // how to call it
          let obj = { a: 1, b: [2,3] };
          print('hello',123,obj);
          

          将在控制台输出:

          [
              "hello",
              123,
              {
                  "a": 1,
                  "b": [
                      2,
                      3
                  ]
              }
          ]
          

          【讨论】:

            【解决方案6】:

            输出obj:

            console.log(obj, null, 4)
            

            【讨论】:

              【解决方案7】:

              使用console.dir() 输出一个可以点击的可浏览对象,而不是.toString() 版本,如下所示:

              console.dir(functor);
              

              打印指定对象的 JavaScript 表示。如果记录的对象是 HTML 元素,则打印其 DOM 表示的属性 [1]


              [1]https://developers.google.com/web/tools/chrome-devtools/debug/console/console-reference#dir

              【讨论】:

              • 需要注意的是,只要在 Chrome 控制台中打印 varName 并按 Enter 即可获得与 console.dir(varName) 相同的效果。
              【解决方案8】:

              这对我来说非常有效:

              for(a in array)console.log(array[a])
              

              您可以提取在控制台中创建的任何数组,用于查找/替换清理以及提取的数据的后续使用

              【讨论】:

              • 更详细一点:for (i in arr) { console.log(i); console.log(arr[i]); }
              • 不会输出不可枚举的属性和方法
              【解决方案9】:

              如果你尝试,你可能会得到更好的结果:

              console.log(JSON.stringify(functor));
              

              【讨论】:

              • 这个答案很好,但我认为不适用于上面的示例,在新标签中尝试并返回 undefined
              • 完全尊重这个答案,最终它返回一个代表对象的字符串,而不是控制台中的“可浏览”对象,就像问题就在这里一样。诚然,如果您通过 JSON.parse 运行此输出字符串,它将返回其对象格式,但随后控制台仍将显示“.toString()”,我们又回到了原点。这里使用“console.dir”的答案最适合手头的问题。
              猜你喜欢
              • 1970-01-01
              • 2023-03-05
              • 2018-11-27
              • 2011-04-20
              • 1970-01-01
              • 2012-09-29
              • 1970-01-01
              • 1970-01-01
              • 2012-02-08
              相关资源
              最近更新 更多