获取 console.log() 以显示自定义对象描述

Get console.log() to display custom object description

本文关键字:显示 自定义 对象 描述 console log 获取      更新时间:2023-09-26

我有一个自定义的JS对象来表示网格。在本例中剥离,它看起来像这样:

function Grid(c, r)
{   
    var layout = [];
    var contentPointer = 0;
    this.getCell = function(c, r)
    {
        //Return selected cell
    }
    this.getRow = function(r)
    {
        //Return selected row
    }
    this.getCol = function(c)
    {
                //Return selected column
    }
    for(var row = 0; row < r; row++)
    {
        layout[row] = [];
        for(var col = 0; col < c; col++)
            layout[row][col] = 0;
    }
}

我在这里和那里使用var aGrid = new Grid(10, 10);创建多个实例,然后以各种方式操作它们; 添加/更新单元格的内容等。

我希望能够做的是调用console.log(aGrid);并能够自定义控制台显示的内容,以便例如,我获得我添加的所有单元格值的字符串或类似内容。

在我习惯了 Actionscript,我们将使用 trace(aGrid); 代替console.log(aGrid);但在 AS3 中,我可以覆盖对象的 toString() 方法,这将更新控制台输出中显示的内容。

我已经看到我可以在 JS 中向我的 Grid 对象添加一个 toString() 方法,但控制台似乎不使用它,除非我专门调用 console.log(aGrid.toString()); .虽然这很好,但我只是想知道是否有办法解决这个问题。

控制台实际上是根据正在记录的对象的某种可覆盖方法生成其输出的,还是会执行一些疯狂的内部魔术来获取值?

使用

alert(aGrid); 似乎使用 toString() 并获取自定义值,但我宁愿剥掉自己的皮肤,也不愿使用 alert(); :) 调试一个大项目

非常欢迎任何和所有的评论。谢谢。

PS - 我不知道不同的浏览器是否以不同的方式对待console.log(),但我使用的是 Chrome v33。

我已经看到我可以在JS中向我的Grid对象添加一个toString()方法,但控制台似乎不使用它,除非我专门调用console.log(aGrid.toString());。虽然这很好,但我只是想知道是否有办法解决这个问题

不,没有办法解决这个问题。控制台本身决定如何显示传递的参数 - Chrome控制台允许您动态检查对象,而不是尝试以某种方式序列化它们。如果你想要一个自定义输出,你需要传递一个字符串。

>console.log接受Object作为参数,如果你把它放在那里,你将能够在Chrome控制台中检查它。

所以删除.toString()它会解决问题

console.log("aGird", aGrid );
你可以使用 console.table

() 来做到这一点。 console.table 允许您指定要查看的属性。例如

console.table(aGrid);                            // will show all properties
console.table(aGrid, 'firstName');               // will show only firstName property
console.table(aGrid, ['firstName', 'lastName']); // will show firstName and lastName properties