关于Function.prototype.apply.call的一些补充

宿主对象，在javascript中有三类对象，本地对象，内置对象和宿主对象。其他两类暂且不提，宿主对象是指什么呢（DOM BOM），控制台对象是文档对象模型的扩展，也被认为是宿主对象。那么，它们有什么缺陷呢？在IE9之前，宿主对象不是继承自Object，它们的方法也不继承自Function，IE9之后就大有改进了。

看下IE8与IE9的document.getElementById

ie8:

ie9:

我们可以看到，ie9的document.getElementById是有Function.prototype上的方法的，所以说，IE9+的宿主对象它们继承了Object，方法继承了Function。

IE8不支持call，所以问题就来了，我们经常会有这样的需求,比如，重新控制台。

很多人想到了console.log.call，但是它不完美，现在你们知道了~~

好，想想解决办法吧：

1、使用Function.prototype.bind，但是...你得为不支持bind的浏览器做兼容

Function.prototype.bind.call(console.log,console).apply(console,arguments)

//摘自MDN

if (!Function.prototype.bind) {

  Function.prototype.bind = function (oThis) {

    if (typeof this !== "function") {

      // closest thing possible to the ECMAScript 5 internal IsCallable function

      throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");

    }

    var aArgs = Array.prototype.slice.call(arguments, 1),

        fToBind = this,

        fNOP = function () {},

        fBound = function () {

          return fToBind.apply(this instanceof fNOP && oThis

                                 ? this

                                 : oThis || window,

                               aArgs.concat(Array.prototype.slice.call(arguments)));

        };

    fNOP.prototype = this.prototype;

    fBound.prototype = new fNOP();

    return fBound;

  };

}

2、new Function+replace (new Function不是说尽量不要用么，还是算了吧！！)

function log(){

    var fn = 'console.log(args)',

    args=[].slice.call(arguments);

    fn = new Function('args',fn.replace(/args/,args.join(',')));

    fn(arguments);

};

3、终极方法

Function.prototype.apply.call(console.log,console,arguments);

这么一对比，第三种方案妥妥的胜出啊，不用考虑兼容，代码简短，虽然不是很好理解~~

说了这么多废话，Function.prototype.apply.call什么时候用，就是在这种应用场景。

如果还有其他的话，那就是那些奇葩面试题，比如：

var f1=function(){console.log(1)};

var f2=function(){console.log(2)};

Function.prototype.call.call(Function.prototype.call,f2)//

Function.prototype.call.call(f1,f2);//

巴特西

关于Function.prototype.apply.call的一些补充

最新文章

热门文章