如何在Safari中更改console.log的默认行为？

Question

在没有附加组件的Safari中,console.log将在最后执行状态下显示对象,而不是在console.log调用时的状态.

我必须克隆对象只是为了输出它console.log来获取该行的对象状态.

例:

var test = {a: true}
console.log(test); // {a: false}
test.a = false; 
console.log(test); // {a: false}

Answer 1

我想你在找console.dir().

console.log()没有做你想要的,因为它打印了对象的引用,当你打开它时,它就被改变了.console.dir在调用它时,在对象中打印属性的目录.

下面的JSON想法很好; 你甚至可以继续解析JSON字符串并获得一个可浏览的对象,就像.dir()会给你的:

console.log(JSON.parse(JSON.stringify(obj)));

Answer 2

如果我想在记录时看到它的状态,我通常会做的就是将其转换为JSON字符串.

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

Answer 3

香草JS:

@ evan的回答似乎最好.只需(ab)使用JSON.parse/stringify有效地制作对象的副本.

console.log(JSON.parse(JSON.stringify(test)));

JQuery特定解决方案:

您可以在某个时间点创建对象的快照 jQuery.extend

console.log($.extend({}, test));

这里实际发生的是jQuery正在用test对象的内容创建一个新对象,并记录它(因此它不会改变).

AngularJS(1)具体解决方案:

Angular提供了一个copy可以用于相同效果的函数:angular.copy

console.log(angular.copy(test));

香草JS包装功能:

这是一个包装的函数,console.log但会在记录它们之前复制任何对象.

我写这篇文章是为了回答一些类似但不太健壮的函数.它支持多个参数,如果它们不是常规对象,则不会尝试复制它们.

function consoleLogWithObjectCopy () {
  var args = [].slice.call(arguments);
  var argsWithObjectCopies = args.map(copyIfRegularObject)
  return console.log.apply(console, argsWithObjectCopies)
}

function copyIfRegularObject (o) {
  const isRegularObject = typeof o === 'object' && !(o instanceof RegExp)
  return isRegularObject ? copyObject(o) : o
}

function copyObject (o) {
  return JSON.parse(JSON.stringify(o))
}

示例用法:consoleLogWithObjectCopy('obj', {foo: 'bar'}, 1, /abc/, {a: 1})

Answer 4

这> Object在控制台中,不仅显示当前状态.它实际上是推迟读取对象及其属性,直到您展开它.

例如,

var test = {a: true}
console.log(test);
setTimeout(function () {
    test.a = false; 
    console.log(test);
}, 4000);

然后展开第一个调用,它将是正确的,如果你在第二个console.log返回之前执行它