为什么我无法在Chrome(和Safari)中将console.log作为回调参数传递？

Question

以下代码段会在Chrome(和Safari)中生成错误,但在Firefox中可以使用.

我希望在javascript控制台中显示2个数字,但在Chrome中我只得到第一个然后是 Uncaught TypeError: Illegal invocation

// a generic promise that return a random float
var makePromise = function() {
  return $.Deferred().resolve(Math.random());
}

// This works in all browsers
makePromise().then(function(d) {
  console.log(d);
});
// This works in firefox only
makePromise().then(console.log);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

为什么会这样？

旁注:我的问题与这个问题不一样.

更新

感谢评论和回答console.log用作回调,我们需要做

makePromise().then(console.log.bind(console));

Answer 1

在chromebook中,我可以按如下方式复制问题:

function do4(cb){ cb(1); cb(2); cb(3); cb(4); }

do4(console.log)
VM1491:2 Uncaught TypeError: Illegal invocation
    at do4 (<anonymous>:2:19)
    at <anonymous>:2:12
    at Object.InjectedScript._evaluateOn (<anonymous>:905:140)
    at Object.InjectedScript._evaluateAndWrap (<anonymous>:838:34)
    at Object.InjectedScript.evaluate (<anonymous>:694:21)do4 @ VM1491:2(anonymous function) @ VM1552:2InjectedScript._evaluateOn @ VM1288:905InjectedScript._evaluateAndWrap @ VM1288:838InjectedScript.evaluate @ VM1288:694

但这很好用,确实指出了问题:

do4(console.log.bind(console))
VM1491:2 1
VM1491:2 2
VM1491:2 3
VM1491:2 4

这是为什么？

在chrome中,console它本身会返回一个Object原型Console,看看:

console
Console {} memory: MemoryInfo__proto__: Console

它可能看起来奇数思想console作为Object,但它是. console还有其他几种较少使用的方法,这些方法不常用,console.log但在MDN控制台文档和Chrome控制台文档中有记录

在这里,我们得到了一个可以让人迷惑的大Javascript主题:

Javascript方法是未绑定的方法.也就是说,这些方法不受任何特定对象的约束.

所以console.log是一个函数,但它只是功能和不保留其绑定this到console.

变量绑定在一个函数的代码中由一个魔术this变量引用,该变量可以用function.bind或设置function.apply.

当console.log()被调用时,JS做的功能码的结合this的console对象.但是当console.log它仅作为函数传递时 ,它不会进行绑定,因此其他代码可以更灵活地使用它.使用console.log和许多其他方法时,这种行为很不方便,但在某些情况下会增加所需的灵活性.