Question

我有一个自定义的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。

Answer 1

我已经看到我可以在JS中为我的Grid对象添加一个toString（）方法但是控制台似乎没有使用它，除非我专门调用console.log（aGrid.toString（））;.虽然这很好，但我只是想知道是否有办法绕过这个

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

Answer 2

console.log接受Object作为参数，如果你把它放在那里，你就可以在Chrome控制台中检查它。

所以删除.toString()并执行操作

console.log("aGird", aGrid );

Answer 3

您可以使用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

获取console.log（）以显示自定义对象描述

3 个答案: