Javascript Console.log仅显示打印对象的更新版本 String.prototype.width=函数（字体）{ var f=font | |“12px arial”， o=$（''+此+''） .css（{'position'：'absolute'，'float'：'left'，'white space'：'nowrap'，'visibility'：'hidden'，'font'：f}） .appendTo（$（“body”）， w=o.宽度（）； o、 删除（）； 返回w； } 函数sortCustomFunction（a，b）{ if（a['text'].width（）b['text'].width（）） 返回1； //a必须等于b 返回0； } var annoObj={ “安诺”：[ //一对木偶（px到teleutaio na mpei prwto kok）是一对木偶，是一对木偶。 {“标签”：“第五”，“文本”：“这是一个示例文本另一个”，“颜色”：“红色”}， {“标签”：“第一”，“文本”：“这是一个样本”，“颜色”：“灰色”}， {“标签”：“第二”，“文本”：“样本”，“颜色”：“绿色”}， {“label”：“sixth”，“text”：“这是一个示例文本另一个文本一个moooorreee”，“color”：“lightgreen”}， {“标签”：“第三”，“文本”：“另一个”，“颜色”：“蓝色”}， {“label”：“forth”，“text”：“one moooorreee”，“color”：“purple”} ] }; console.log（annoObj.anno）//这将打印未排序的数组（但打印已排序的数组）。 annoObj.anno.sort（sortCustomFunction）//对数组进行排序 console.log（annoObj.anno）//这将打印已排序的（确实如此）

我正在做上述工作，一切正常。json对象内的数组按数组json元素中“text”键的宽度值排序。 我注意到的是console.log中的这种奇怪行为。我在排序前和排序后打印数组，在两种打印中都是一样的。它打印已排序的数组。为什么会这样

---

排序没有问题，但这是大多数浏览器控制台的一个众所周知的特性（优化）：只有在打开对象时，才会使用对象的新值构建树

如果您想在记录时查看对象的状态，假设它足够小并且不是自引用对象，您可以像这样克隆它：

String.prototype.width = function(font) {

  var f = font || '12px arial',
      o = $('<div>' + this + '</div>')
            .css({'position': 'absolute', 'float': 'left', 'white-space': 'nowrap', 'visibility': 'hidden', 'font': f})
            .appendTo($('body')),
      w = o.width();

  o.remove();

  return w;
}


function sortCustomFunction(a, b) {
  if (a['text'].width() < b['text'].width())
     return -1;
  if (a['text'].width() > b['text'].width())
     return 1;
  // a must be equal to b
  return 0;
}

var annoObj = {
        'anno' : [
            //an paikseis me auta (px to teleutaio na mpei prwto kok) oi mikres metatwpiseis ofeilontai sto padding.
            { "label" : "fifth" , "text"  : "This is a sample text another one" , 'color' : 'red' },
            { "label" : "first" , "text"  : "This is a sample" , 'color' : 'grey' },
            { "label" : "second" , "text" : "sample" , 'color' : 'green' },
            { "label" : "sixth" , "text"  : "This is a sample text another one text one mooooorreee" , 'color' : 'lightgreen' },
            { "label" : "third" , "text"  : "another one" , 'color' : 'blue' },
            { "label" : "forth" , "text"  : "one mooooorreee" , 'color' : 'purple' }        
        ]
    };

    console.log(annoObj.anno);   //This should print the unsorted array (but it prints the sorted array).
    annoObj.anno.sort(sortCustomFunction); //Sort the array
    console.log(annoObj.anno);  //This should print the sorted (and it does)

---

使用

console.table

进行表格布局。Firebug和最新版本的Google Chrome支持

---

当这个问题结束时，我正在回答一个重复的问题。正如一个相关的注意事项，Stackoverflow的代码片段确实打印了对象的实际当前值，而没有浏览器的bug

让dummyArr=[
{“name”：“a”，“isChecked”：true}，
{“name”：“b”，“isChecked”：false}，
{“name”：“c”，“isChecked”：true}
];
控制台日志（dummyArr）；
document.getElementById（'a'）.innerHTML=JSON.stringify（dummyArr）；
对于（变量i=0；i

我不知道这个命令的确切副本（javascript新手）。非常感谢。将其作为我将向上投票的答案发布。顺便说一句，你真的应该只获得每个字符串的
.width（）
一次-这是一个相当繁重的计算。@Bergi感谢你的建议。这是一个更大项目的一部分，我现在正在制作一个演示。自定义将在稍后进行。@Bergi您是对的，我搜索了，但我没有使用正确的词，因为我在建议中迷失了方向。请注意，如果您确实需要记录大对象和递归对象，您还有一个解决方案：。但大多数情况下，您可以将日志限制在足够小的部分。
console.log(JSON.parse(JSON.stringify(annoObj.anno)));